CODEWITHSUNDEEP
jqueryradio-button
user2033755
user2033755

Reputation: 1

Disable radio button with jQuery in dynamic form

I've been driving myself nuts trying to get a radio button to be disabled in a form that is generated dynamically. This is the code that I am using. What is throwing an error is the ID name because of all the brackets in it. I tried escaping them but to no avail.

The script:

$(document).ready(function() {

 $("div.property_options_select input[id='#akID\\[114\\]\\[atRadioOptionID\\]\\[\\]1']").on('click',function(){
    $("input:radio").attr('disabled',true);
    });
});

The html:

<div class="property_options_select">

            <label class="radio">
              <input type="radio" name="akID[114][atRadioOptionID][]" id="akID[114][atRadioOptionID][]1" value="17"  class="ccm-input-radio"  />                  9:00AM - 11:00AM              </label>


            <label class="radio">
              <input type="radio" name="akID[114][atRadioOptionID][]" id="akID[114][atRadioOptionID][]2" value="18"  class="ccm-input-radio"  />                  9:30AM - 11:30AM              </label>

Anyone have a suggestion how to target that first radio button?

Upvotes: 0

Views: 328

Answers (4)

Gregg Duncan
Gregg Duncan

Reputation: 2725

You have to use the double slash inside a jquery selector.

   $(document).ready(function() {
        $("div.property_options_select input[id='#akID\\[114\\]\\[atRadioOptionID\\]\\[\\]1']").on('click',function(){
            $("input:radio").attr('disabled',true); 
        }); 
    });

Upvotes: 0

kunruh
kunruh

Reputation: 874

You don't need to escape the brackets. You just need to remove the #.

Your selector will be $("div.property_options_select input[id='akID[114][atRadioOptionID][]1']")

https://jsfiddle.net/3h4jpm1e/

Upvotes: 0

Pato Arenas
Pato Arenas

Reputation: 1

You tried with double backslash?

$('#akID\\[114\\]\\[atRadioOptionID\\]\\[\\]1').prop('disabled', true);

Upvotes: 0

Sandeep Nayak
Sandeep Nayak

Reputation: 4757

You can target the first child using the :first-childselector like this:

$("input:radio:first-child").attr("disabled","disabled");

http://jsfiddle.net/dajzvysg/

Upvotes: 1

Related Questions