CODEWITHSUNDEEP
javascriptjqueryhtmlselectcombobox
Süleyman K
Süleyman K

Reputation: 309

How to use onchange function select tag for javascript

I am trying to update my combobox values while user changing it.

in html codes:

<select class="combobox" id="recs" name="recs" onchange="changeRecs">
    <option value=5>5</option>
    <option value=10>10</option>
    <option value=20>20</option>
</select>

javascript codes:

$scope.changeRecs = function() {
    //somethings
    $scope.loadTable();
}

Thanks for helping...

Upvotes: 0

Views: 10890

Answers (4)

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167202

There's an error in your syntax:

<select class="combobox" id="recs" name="recs" onchange="changeRecs">
<!-----------------------------------------------------------------^

You forgot the parentesis ().

You just need to do:

document.querySelector("#recs").onchange = function (e) {
  // some things
  alert("Changed");
}

And in jQuery, you do:

$('#recs').on('change', function(){
    //action here
});

Snippet (Vanilla JS)

document.querySelector("#recs").onchange = function (e) {
  // some things
  alert("Changed to " + this.value);
}
<select class="combobox" id="recs" name="recs" onchange="changeRecs">
  <option value=5>5</option>
  <option value=10>10</option>
  <option value=20>20</option>
</select>

Snippet (jQuery)

$('#recs').on('change', function () {
  //action here
  alert("Changed to " + $(this).val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<select class="combobox" id="recs" name="recs" onchange="changeRecs">
  <option value=5>5</option>
  <option value=10>10</option>
  <option value=20>20</option>
</select>

Upvotes: 4

Suresh
Suresh

Reputation: 923

on change of selection below function vl trigger in jquery. You can use this

 $("#recs").change(function() { 
    //perform the operation whatever u required 
 });

Upvotes: -1

oshell
oshell

Reputation: 9123

Using jQuery you would use something like this.

$('#recs').on('click', function(){
    //action here
});

Upvotes: 1

ben
ben

Reputation: 3568

You are almost there. You missed the () in the change attribute:

function changeRecs() {
  alert('has changed');
}
<select class="combobox" id="recs" name="recs" onchange="changeRecs()">
    <option value=5>5</option>
    <option value=10>10</option>
    <option value=20>20</option>
</select>

Upvotes: -1

Related Questions