c# - OnClick or something inside Select -

my select option looks way,

<select class="chosen">     <option value='' disabled selected style='display:none;'>add new criteria</option>                                               @foreach (var item in model)     {        <option value="" onclick="showmessage(@item.criteria);">@item.criteria</option>     } </select>  

the foreach loop has somewhere around 20 values need individual values of them when clicked..i cannot use onclick on select because values inside foreach. jquery

function showmessage(criteria) {     alert(criteria); } 

let me know use instead of onclick="" because isn't working...

since using jquery, should bind change event using it.

html

<select class="chosen">     <option value='' disabled selected style='display:none;'>add new criteria</option>                                               @foreach (var item in model)     {        <option value="" data-criteria="@item.criteria">@item.criteria</option>     } </select>  

script

$(document).ready(function() {     $('.chosen').on('change', function(){         var criteria = $(this).find('option:selected').data('criteria');         //as per current html, can use .text()          //var criteria = $(this).find('option:selected').text();         alert(criteria);     }); });