CODEWITHSUNDEEP
javascriptjqueryhtmlradio-button
Guru
Guru

Reputation: 420

jQuery on change event for radio button

This is my html:

<div class="form-item">
 <label>Disability: </label>
  <div class="form-radios student_course_disablity">
    <div class="form-item" id="edit-student-course-disability-not-stated-wrapper">
     <label class="option" for="edit-student-course-disability-not-stated">
      <input type="radio" id="edit-student-course-disability-not-stated" name="student[course][disability]" value="not_stated" checked="checked" class="form-radio student_course_disablity">  Not Stated</label>
    </div>
 <div class="form-item" id="edit-student-course-disability-yes-wrapper">
   <label class="option" for="edit-student-course-disability-yes">
     <input type="radio" id="edit-student-course-disability-yes" name="student[course][disability]" value="yes" class="form-radio student_course_disablity"> Yes</label>
 </div>
 <div class="form-item" id="edit-student-course-disability-no-wrapper">
   <label class="option" for="edit-student-course-disability-no">
     <input type="radio" id="edit-student-course-disability-no" name="student[course][disability]" value="no" class="form-radio student_course_disablity"> No</label>
 </div>
</div>

I want to run onchange event for this radio button:

I've tried this method:

$('input[type=radio][name=student[course][disability]]').change(function() {
  alert('hi');
});

But no luck

Upvotes: 1

Views: 23101

Answers (2)

Ibrahim Khan
Ibrahim Khan

Reputation: 20750

Put name in double quote like below. Hope this will help.

$('input[type=radio][name="student[course][disability]"]').change(function () {   
    alert('hi');
});

Upvotes: 7

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167210

It is better you group by the class rather than using name selector, that too without " quotes. You might want to use: 'input[name="student[course][disability]"]'.

$('input.student-course-disability').on("change click", function() {
  alert('hi');
});

Add click event too, just in case. Don't forget to give the class to the <input /> elements.

I have already given you the best solution, but for your updated solution:

$('input[name="student[course][disability]"]').change(function () {   
    alert('hi');
});

Upvotes: 0

Related Questions