CODEWITHSUNDEEP
jqueryajaxcodeigniter
user2412936
user2412936

Reputation: 369

how to get the radio button value

am using the following code for getting radio buton value but am not getting. i need to get this radio button value. please help me thanks

<input type="radio" id="high" name="high" value="Y" />
<label> Y </label>&nbsp;&nbsp;&nbsp;&nbsp;
<input type="radio" id="high" name="high"  value="N"/>
<label> N </label>

submitHandler: function () {
    var form_data = {
        state: $("#state").val(),
        fiscal_yr: $("#fiscal_yr").val(),
        high: $("#high").val(),
        date_biennial_budget: $("#date_biennial_budget").val(),
        //  password: $("#password").val(),
        is_ajax: 1

    };
    $.ajax({
        cache: false,
        type: "POST",
        url: '<?php echo base_url();?>survey/actual_budget',
        data: form_data,
        success: function (response) {
            if (response != 'failed') {
                $("#content").load("<?php echo base_url().'survey/actual_budget' ?>");
            }
        }
    });
}
});

Upvotes: 0

Views: 2010

Answers (5)

godfrzero
godfrzero

Reputation: 2270

As others have mentioned, you can use the input:radio[name="high"]:checked selector and the jQuery val() method to get this done, but I thought I'd add some improvements that might help out future visitors:

Labels: The whole point of a label is lost if it's not attached to an actual element. So either enclose your element within the label, or use the for attribute after assigning your input an id:

<!-- One way to do this -->
<label><input type="radio" id="high" name="high" value="Y" /> Y </label>

<!-- Or another way -->
<input type="radio" id="uniqueID" name="high" value="Y" />
<label for="uniqueID"> Y </label>

This improves accessibility. Screenreaders won't see random form labels floating around, and regular users will be able to click on the label to select the option.

CSS Identifiers: Identifiers are meant to be unique. If you use more than one in a document, I'm not even sure what'll happen. I've had bugs where the part of the code depending on the selector doesn't work, or it only works on the first element. I'll look into this and update if I notice any consistently strange behavior, but the bottom line is to keep your IDs unique.

Serializing Form Data: Since you already have jQuery included, you have two methods available that can serialize your form for you. Of course, I'm assuming these are all within the same form, or else you'll have to write a possibly complex selector to select just the form elements you want. If so, you can do one of the following: serialize() or serializeArray()

// Returns the formdata serialized as a string, similar to a GET request
$('form#selector').serialize();

// Returns the formdata serialized as an array, use if you want to send JSON etc.
$('form#selector').serializeArray();

Upvotes: 1

bipen
bipen

Reputation: 36531

change you id to class and use class selector. 

 <input type="radio" class="high" name="high" value="Y" /><label> Y </label>&nbsp;&nbsp;&nbsp;&nbsp; 
<input type="radio" class="high" name="high"  value="N"/><label> N </label>


 ...
 high:$('input[name="high"]:checked').val();
 ...

NOTE: IDs should always be unique.

OR you can just serialzie the form and send it as object

 $.ajax({
    cache : false,
    type: "POST",
    url: '<?php echo base_url();?>survey/actual_budget',
    data: $('#formID').serialize(),

and you can take the posted values with..

 $this->input->post('inputName');

Upvotes: 0

Girish Kumar Sinha
Girish Kumar Sinha

Reputation: 832

For getting selected radio button value use following in jquery:
var value=$("input[type=radio]:checked").val();
or 
var value=$('input[name=radiobuttonname]:checked').val()

So, your code will be like this :
 <input type="radio" id="high" name="high"  value="Y" /><label> Y </label>&nbsp;&nbsp;&nbsp;&nbsp; 
       <input type="radio" id="high" name="high"  value="N"/><label> N </label>

        submitHandler: function() {
        var form_data = {
            state: $("#state").val(),
            fiscal_yr: $("#fiscal_yr").val(),
            high: $("input[type=radio]:checked").val(),
            //high: $("input[name=high]:checked").val(),
            date_biennial_budget: $("#date_biennial_budget").val(),
            //password: $("#password").val(),
            is_ajax: 1

        };
        $.ajax({
            cache : false,
            type: "POST",
            url: '<?php echo base_url();?>survey/actual_budget',
            data: form_data,
            success: function(response)
            {
                if (response != 'failed') {
                    $("#content").load("<?php echo base_url().'survey/actual_budget' ?>"); 
                }
            }
        });
    }   
    });

Upvotes: 0

Popo
Popo

Reputation: 2460

Have you tried:

$('#high:checked').val()

You will need to put in a condition to check whether either radio button is checked first, or just check if this does not return 'undefined'

Upvotes: 0

SomeShinyObject
SomeShinyObject

Reputation: 7801

You can get the value of the radio button input using:

high: $("input:radio[name=high]:checked").val()

Take out the ID. Two people having the same ID in real life is called identity theft and is illegal. It should also be in HTML.

Upvotes: 2

Related Questions