Lately I’ve been having some difficulties in setting the radio button values the way it should via jquery on load. i have been setting radio buttons from before and it seems something just wasn’t right on this instance. here is my UI.
my HTML: (i am using bootstrap, so dont mind the extra class codes)
<div class="form-group"> <label class="control-label ">Gender <span class="required"> * </span></label> <div class="radio-list"> <label class="radio-inline"> <input type="radio" class="form-control input-sm " data-required="1" name="patient_gender" id="gender_m" value="M"> M </label> <label class="radio-inline"> <input type="radio" class="form-control input-sm " name="patient_gender" data-required="1" id="gender_f" value="F"> F </label> </div> </div>
my JS:
$('input[name=patient_gender][value="' + data.gender + '"]').prop('checked', true);
it should work right? but it did not. i have tried several other options the only one that worked was by adding a trigger. making my new JS code to be:
$('input[name=patient_gender][value="' + data.gender + '"]') .prop('checked', true) .trigger('click');
Just leaving this here, i have spent hours trying to make this work, and almost lost all my hair.