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.
this i'm trying achieve.
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.
any hints / helps / suggestions mean lot me.
.prop('disabled', true);
believe typo or something, disable every options.the
true
,false
value in jsonobj maystring
. so, no matter value'true'
or'false'
, treadedtrue
,!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
Post a Comment