Best way for retrieve custom data attribute from event in Meteor?

Question

I was wondering what is the best way for retrieve the value of a custom data HTML attribute with Meteor from event object?

eg:

articles.html

   <template name="createArticle">
    <form class="new-article">
        <input type="text" name="title" placeholder="New title"/>
        <input type="text" name="content" placeholder="New content" />
        <!-- list categ -->
      <label>Category
        <select id="categ-list" name="categ">
          {{#each categories}}
            <option value="{{name}}" data-id={{_id}}>{{name}}</option>
          {{/each}}
        </select>
      </label>
        <input type ="submit" value= "Create" class="button">
    </form>
</template>

articles.js

   Template.createArticle.events({
  "submit .new-article": function(event){
    var title = event.target.title.value;
    var content = event.target.content.value;
    var categName = event.target.categ.value;
    var categId = event.target.categ.data('id'); // HERE
    console.log("test " + categId);
    Meteor.call("addArticle", title, content, categId, categName);
    event.target.title.value = "";
    event.target.content.value = "";
    return false;
    },
    "click #categ-list": function(event){
console.log('click');
    }
  });

How can I get the data-id attribute value in the event handler?

EDIT: Add more code

EDIT2:

console.log(event.target.categ)

output:

<select id="categ-list" name="categ"> 
<option value="test" data-id="p5zKaEbEiRkQjCkGg">test</option> 
<option value="test1" data-id="okPY6oyeXiFR7M3jd">test1</option> 
</select>

Answer 1

DOM elements (HTMLElement objects) don't have .data() method. .data() method belongs to jQuery objects. If you are using jQuery you should wrap the element with jQuery constructor then use the .data method:

$(event.target.categ).data('id');

Another option is using .dataset property ¹:

event.target.categ.dataset.id;

Or .getAttribute() method:

event.target.categ.getAttribute('data-id');

update:

You should also select the selected option before using dataset property.

var sel = event.target.categ;
var categId = sel.options[sel.selectedIndex].getAttribute('data-id');

---

^{1. IE10 and below partially support the property. Android 2.3 cannot read data-* properties from select elements.}