antonjs
antonjs

Reputation: 14328

Adding a custom attribute for a better separation between JavaScript and HTML

Using jQuery and backbone.js, I would like to separate the JavaScript from the HTML as much as possible.
Is it possible to add a custom attribute for a better separation between JavaScript and HTML? And then how can I use the new jQuery selector?

Example:

<input type="text" id="todo-input" class="todo-input" tid="tid-attribute" > hello world </input>

// The DOM events
// I would like to use another selector tid and not class or id
events: {
  "keypress #todo-input" : "updateOnEnter" // I would like to use another selector tid not id,
  "keypress .todo-input" : "updateOnEnter" // I would like to use another selector tid and not class
}

Upvotes: 1

Views: 382

Answers (2)

Jesse
Jesse

Reputation: 5114

HTML5 allows for custom data attributes that start with data-:

<input type="text" data-custom-attr="somevalue">

Then in your backbone events declaration:

"keypress [data-custom-attr='somevalue']" : "updateOnEnter"

Upvotes: 3

thecodeparadox
thecodeparadox

Reputation: 87073

you can use:

$('input[type="text"]').attr('tid', 'tid-attribute');

OR

$('input[type="text"]').attr('data-tid', 'tid-attribute');

Upvotes: 0

Related Questions