CODEWITHSUNDEEP
javascriptjquery
ma32112345
ma32112345

Reputation: 67

Get true or false for radio button in Javascript

I am getting data from my view, and using JavaScript to save.

HTML:

 <div>
     @Html.LabelFor(model => parts.ReturnRequired)
     @Html.RadioButtonFor(model => parts.ReturnRequired, true) Yes
     @Html.RadioButtonFor(model => parts.ReturnRequired, false) No
 </div>

This is my JavaScript:

$(document).ready(function () {
    $('#btPartHeaderSave').click(function () {
        var status = $('#parts_Status').val();
        var partsRequestOrderNum = $('#parts_PartsRequestOrderNum').val();
        var custShipping = $('#parts.CustShipping').val();
        var shipAddress1 = $('#parts_ShipAddress1').val();
        var shipAddress2 = $('#parts_ShipAddress2').val();
        var shipCounty = $('#parts_ShipCounty').val();
        var postCode = $('#parts_ShipPostCode').val();
        var deliveryType = $('#parts_DeliveryType').val();
        var notes = $('#parts_Notes').val();
        //var returnRequired = $('#ReturnRequired').val() == true;

        $.ajax({
            url: $(this).attr('data-url'),
            //url: "/Parts/PartHeaderSave",
            type: "POST",
            data: JSON.stringify({
                status: status, 
                partsRequestOrderNum: partsRequestOrderNum, 
                custShipping: custShipping, 
                shipAddress1: shipAddress1, 
                shipAddress2: shipAddress2, 
                shipCounty: shipCounty, 
                postCode: postCode, 
                deliveryType: deliveryType, 
                notes: notes, 
                returnRequired: returnRequired
            }),
            dataType: "json",
            traditional: true,
            contentType: "application/json; charset=utf-8",
            success: function (data) {
                alert("You have sucessfully saved the header");
                alert(returnRequired);
                //   $('#alertSavePartOrderHeader1').addClass('in');
            },
            error: function () {
                alert("An error has occured!!!");
            }
        });
    });
});

I am trying to get the value of ReturnRequired.

//var returnRequired = $('#ReturnRequired').val();

How do I set this up, to show in the database as 1 or 0? I am assuming using, .val() won't work.

For some reason, if I click yes it returns 0, and if I click no, it still returns 0, even though in my html I got my true / false.

Upvotes: 3

Views: 16523

Answers (4)

meskobalazs
meskobalazs

Reputation: 16041

The :checked pseudo-class selector is applicable for checkboxes and radio buttons. This will convert the boolean value of the checked property to 0 or 1:

var returnRequired = $('#ReturnRequired').is(':checked') ? 1 : 0;

You can also use the double tilde solution, but I do not think that the potential small performance gain is worth the lack of readability.

Another solution is using Number constructor, or using an implicite cast with the unary +. These are equivalent.

var returnRequired = new Number($('#ReturnRequired').is(':checked'));
var returnRequired = +$('#ReturnRequired').is(':checked');

You can depend on this solution, because the ECMAScript standard specifies, that true is converted to 1 and false to 0.

Upvotes: 4

Chris
Chris

Reputation: 200

var getter = $('#ReturnRequired').prop('checked');
var setter = $('#ReturnRequired').prop('checked',false);

Upvotes: 1

Etheryte
Etheryte

Reputation: 25319

First, check if the radio-button is checked or not. From there on, turning the boolean value into a number is very straight forward.

~~(true) //1
~~(false) //0

Upvotes: 0

Viswanath Donthi
Viswanath Donthi

Reputation: 1821

Try this:

var returnRequired = $('#ReturnRequired').is(':checked');

Upvotes: 0

Related Questions