Get selected value of radioButtonList using jQuery in Yii

Get selected value of radioButtonList using jQuery in Yii

Sometimes you want to get selected value of radioButtonList using jQuery in your Yii powered application and it feels difficult due to Yii’s field naming conventions, as every field name contains array.

Lets take an example. Suppose you have a radioButtonList as shown below and you want to enable/disable another field based on user selection from radioButtonList.

<div class="row">
    <?php echo $form->labelEx($model, 'nationality'); ?>
    <?php
    echo $form->radioButtonList($model, 'nationality', array(
        'US' => 'US',
        'Non US' => 'Non US',
            ), array(
        'onChange'=>'toggleSSN();'
    ));
    ?>
    <?php echo $form->error($model, 'nationality'); ?>
</div>

<div class="row">
    <?php echo $form->labelEx($model, 'ssn'); ?>
    <?php echo $form->textField($model, 'ssn', array('size' => 9, 'maxlength' => 9, 'disabled'=>true)); ?>
    <?php echo $form->error($model, 'ssn'); ?>
</div>

We have added a JavaScript function onChange event of our radio buttons. Below code demonstrate how you can check selected value of radioButtonList using jQuery and perform conditional logic.

function toggleSSN(){
    var nationality = $('input[name="User[nationality]"]:checked').val();
    
    if(nationality == 'US')
    {
        $('#User_ssn').attr('disabled', false);
    }
    else
    {
        $('#User_ssn').attr('disabled', true);
    }
}