0

I have a particular scenario where I need a file name, not once but twice, because I pass the variable to an ASP.NET MVC controller. Is it a good idea to either store the file name in a DOM element like a span or div, and getting the value by using jQuery's .text() function? Or would a better approach be to work with JSON-like objects that are initialized and then continuously manipulated?

The question however remains. Is it a good or bad idea to store variables in HTML DOM elements?

Improve this question

2 Answers 2

Reset to default
2

As @Atticus said, it's fine to do it either way, and I'll do both depending on what I need the data for: If it's specifically tied to the element, I'll store it on the element; if it's more general to the page, I'll pass back an object using JSON notation.

When storing data on DOM elements, you don't need to store them as text within the element. You can use data-* attributes instead. These are valid as of HTML5 and work in all browsers right now. The only downside is that if you're using validation as part of your workflow, and you're not yet using HTML5 to validate (and that wouldn't be surprising, the validator isn't quite ready, what with the spec still being rather in flux!), they don't validate in HTML 4.01 or below. But browsers are fine with them, this is one of the areas where HTML5 is codifying (and reigning in) current practice, rather than innovating.

Improve this answer
Sign up to request clarification or add additional context in comments.

5 Comments

@TJ -- Seriously? so you can treat data-* as a custom attribute too for say storing some associated information to a control let's say? perhaps if we want to tell if a value of a field is different from the original you can have <input type="text" id="name" name="name" data-orig="<?php echo $name; ?>" /> and compare based of the one control?? This is great to know, i did not know this.
re reading your response.. that's exactly what you said. Perfect
@Atticus: You can indeed, although in your example, you don't actually have to. input[type=text] elements use the "value" attribute to seed the initial value of the value property of the element, but if the value property changes, the "value" attribute does not. (By design.) Also, there's the defaultValue property of elements that's supposed to reflect the value they had when they were first created. But that's a digression. Yes, you can use data-* attributes to store anything you want on DOM elements.
@Atticus (and any lurkers): There were a lot of "values" thrown around in my comment above, an example can speak volumes, so: jsbin.com/ewomu4 Note that this behavior is not necessarily the same for all input elements! type='text' behaves this way, but not (for instance) type='button'. (Why not? I have no Earthly idea.)
@TJ -- thanks, good example to see. I feel a bit embarrassed to say this but I did not know about the defaultValue property.. Well actually I knew it existed as I discovered it in Visual Studio but I thought it was just a property of an ASP control dealing with databinding... and data-* is just awesome.
1

Either one works, and it's fine to store data in a DOM. It more so depends on the complexity of the operation you are trying complete, which sounds simple -- storing file names. I think you should be fine doing it this way. Storing in JSON object works too, I would go with whatever fits your structure best and which ever works easier with your client/server handshake.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.