javascript - How can I disabled select option(s) base on the JSON data got from AJAX? -


i have dropdown-menu couple options. want loop through them , prop disabled attribute on of them base result ajax call.

enter image description here

this i'm trying achieve.

enter image description here


sample reportable data

s-00591 | true s-00592 | false s-00593 | false s-00594 | false s-00595 | false  

html

<select class="rn-dropdown" id="rn-dd">     <option value="class-view">class view</option>     <!-- students populate here  -->     <option value="s-00591">student s00591</option>     <option value="s-00592">student s00592</option>     <option value="s-00593">student s00593</option>     <option value="s-00594">student s00594</option>     <option value="s-00595">student s00595</option> </select> 

js

success: function(reportable) {        $.each(reportable , function(i, v) {          var userid = v.userid;         var reportable = v.reportable;         var currentval = userid;          console.log('start');         console.log(userid + " | " +reportable);         $('#rn-dd option[value="' + currentval + '"]').prop('disabled', true);         console.log('end');      });    } 

result,

i got no error displaying console. keep seeing dropdown-menu not disabled want them to.

enter image description here

any hints / helps / suggestions mean lot me.

  1. .prop('disabled', true); believe typo or something, disable every options.

  2. the true, false value in jsonobj may string. so, no matter value 'true' or 'false', treaded true, !reportable false, means won't disable option.

you may have check if string first, :

reportable = (typeof v.reportable === 'string') ? v.reportable === 'true' : v.reportable 

to convert boolean first.

var reportable = [    {userid: 's-00591', reportable: 'true'},    {userid: 's-00592', reportable: 'false'},    {userid: 's-00593', reportable: 'false'},    {userid: 's-00594', reportable: 'false'},    {userid: 's-00595', reportable: 'false'}  ];    // check diff between string , boolean.  var reportable2 = [    {userid: 's-00591', reportable:  true},    {userid: 's-00592', reportable: false},    {userid: 's-00593', reportable: false},    {userid: 's-00594', reportable: false},    {userid: 's-00595', reportable: false}  ];        $.each(reportable , function(i, v) {    var userid = v.userid;    var reportable = v.reportable;    var currentval = userid;      console.log('start');    console.log(userid + " | " +reportable);    $('#rn-dd option[value="' + currentval + '"]').prop('disabled', !reportable);    console.log('end');    });    $.each(reportable2 , function(i, v) {    var userid = v.userid;    var reportable = v.reportable;    var currentval = userid;      console.log('start');    console.log(userid + " | " +reportable);    $('#rn-dd2 option[value="' + currentval + '"]').prop('disabled', !reportable);    console.log('end');    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>  <select class="rn-dropdown" id="rn-dd">      <option value="class-view">class view</option>      <!-- students populate here  -->      <option value="s-00591">student s00591</option>      <option value="s-00592">student s00592</option>      <option value="s-00593">student s00593</option>      <option value="s-00594">student s00594</option>      <option value="s-00595">student s00595</option>  </select>    <select class="rn-dropdown" id="rn-dd2">      <option value="class-view">class view</option>      <!-- students populate here  -->      <option value="s-00591">student s00591</option>      <option value="s-00592">student s00592</option>      <option value="s-00593">student s00593</option>      <option value="s-00594">student s00594</option>      <option value="s-00595">student s00595</option>  </select>


Comments

Popular posts from this blog

yii2 - Yii 2 Running a Cron in the basic template -

asp.net - 'System.Web.HttpContext' does not contain a definition for 'GetOwinContext' Mystery -

mercurial graft feature, can it copy? -