Trung Tran
Trung Tran

Reputation: 13751

How can I return the ID of a selected option value in meteor using change event?

I am building an app using Meteor and I have a dropdown list that is populated by mongodb values. Is there a way I can return the option value id when I select one of the DDL items? Here is my current html:

<td>
<select id="clientsSelect" name="clients">
    <option disabled selected> Select Client </option>
        {{#each users}}
    <option value="{{this._id}}">{{this.profile.companyName}} - {{this._id}}</option>
        {{/each}}
</select>
</td>

My templates.js:

Template.adminTemplates.events({
"change #clientsSelect": function(event, template){
    var selectValue = template.$("#clientsSelect").id();
    console.log('select: ' + selectValue)
  }
});

Based on the code above, i specifically want to to return the option value's this._id. I tried template.$("#clientsSelect").id() but this returns Uncaught TypeError: template.$(...).id is not a function.

Can someone help? Thanks!

Upvotes: 1

Views: 1787

Answers (2)

Hasan BINBOGA
Hasan BINBOGA

Reputation: 822

You can also use:

Template.adminTemplates.events({
"change #clientsSelect": function(event, template){
    var selectValue = event.target.value;
    console.log('select: ' + selectValue)
  }
});

Upvotes: 1

Trung Tran
Trung Tran

Reputation: 13751

I'm not 100% sure why this works, but the solution is:

var selectValue = $("#clientsSelect").val()

This will return the selected value's ID attribute, not the select value's text that shows up in the drop down list.

Upvotes: 2

Related Questions