HTML5 allows us to create our own custom attributes to store data. Custom attributes can be called anything we like, like variable names, but they need to be prepended with the word ‘data’, and words are separated by dashes. You could add “foo”, “bar”, and “foo bar” data attributes to an input like this: <input … Read more
You just need to put double quotes around it: <input data-bind=’text: Title, attr: {“data-id”: “Events[” + viewModel.events.indexOf($data) + “].Title”}’/>
.data() doesn’t operate on data attributes but in internal jQuery cache. Initially if no cache record is found, the data is read from a corresponding data- attribute if one exists, but that is the end of their co-operation. If it operated on attributes, it would be useless for its purpose because attribute values must be … Read more
Wouldn’t ‘delete’ remove dataset element? E.g.: <div id=”a1″ data-foo=”bar”>test</div> <script> var v = document.getElementById(‘a1’); alert(v.dataset.foo); delete v.dataset.foo; alert(v.dataset.foo); </script>
dataset is a native property of an element that contains the data attributes, it’s a new(ish) addition and as such is only supported in IE11+, Chrome 8+, FF 6+ etc. A more cross browser solution would be to get the attribute directly webappData.getAttribute(‘data-rating’); data() is a jQuery method, and other than using the HTML5 data … Read more
data doesn’t set data-* attributes. It manages a data cache unrelated to data-* attributes. It initializes from data-* attributes if there are any present, but never writes to them. To write to an attribute, use attr. Example: Updated Fiddle var div = $(“<div />”) $(div).attr(“data-foo”, “bar”) console.log($(div)[0].outerHTML) What you’re seeing is just one of the … Read more
You could use the .attr() function: $(this).attr(‘data-fullText’) or if you lowercase the attribute name: data-fulltext=”This is a span element” then you could use the .data() function: $(this).data(‘fulltext’) The .data() function expects and works only with lowercase attribute names.
Here’s the simple solution. Not everything has to be written with extension method in .NET code. One of the great things about MVC is it gives you easy access to construct your own HTML. With MVC4 you can get the id and name of the element on the expression tree with the helpers HTML.NameFor and … Read more
You will eventually be able to use background-image: attr(data-image-src url); but that is not implemented anywhere yet to my knowledge. In the above, url is an optional “type-or-unit” parameter to attr(). See https://drafts.csswg.org/css-values/#attr-notation.
From the selectors specification: Attribute values must be CSS identifiers or strings. Identifiers cannot start with a number. Strings must be quoted. 1 is therefore neither a valid identifier nor a string. Use “1” (which is a string) instead. var a = document.querySelector(‘a[data-a=”1″]’);