user2167861
user2167861

Reputation: 179

JQuery always returning false for checkbox value

I'm working on an C# MVC 4 project and am having problems determining if a checkbox is checked using jquery. Basically, I need to show and hide other controls on the page based on the value of a checkbox. Here is the cshtml code for the checkbox :

     @if (Model.SkuCustomizations[i].hasStoneChange)
     {
        <div class="two-col-label">@Html.DisplayNameFor(m => m.SkuCustomizations[i].Stone_HasChange)</div>
        <div id="divStoneChange" data-idx="@i" class="two-col-value">
            <input type="checkbox" id="chkStone_@i" name="stoneChange" checked="@Model.SkuCustomizations[i].Stone_HasChange">
        </div>
       <div class="last" />
     }

And here is the code to try and pull the checked value:

$('#divStoneChange').change(function () {
    var idx = $('#divStoneChange').attr('data-idx')
    var stone = $('#chkStone' + idx).is(':checked')
    if (stone != false)
    {
        $("#divVendorCost").show();
    }
    else
    {
        var type = $('#ddMetalType' + idx).val();
        var mount = $('#chkMount' + idx).is(':checked')
        var subcat = $('#ddSubCat' + idx).val();
        if (mount != true && (subcat == "Whole Set" || subcat == "" || subcat == "-- Select --" || subcat == undefined) && (type == "-- Not Customized --" || type == "" || type == undefined))
        {
            $("#divVendorCost").hide();
        }
    }
});

$('#chkStone' + idx).is(':checked') always returning false no matter the value of the checkbox. Can someone point out what I'm doing wrong?

Thanks

Upvotes: 0

Views: 1988

Answers (2)

bipen
bipen

Reputation: 36531

you missed _ there in your selector

var stone = $('#chkStone_' + idx).is(':checked');
           //-----------^---here;

try this,

  ...
  var idx = $('#divStoneChange').attr('data-idx');
  if ($('#chkStone_' + idx).is(':checked'))
  {
    $("#divVendorCost").show();
  }
  else
  {
    var type = $('#ddMetalType' + idx).val();
    var mount = $('#chkMount' + idx).is(':checked')
    var subcat = $('#ddSubCat' + idx).val();
    if (mount != true && (subcat == "Whole Set" || subcat == "" || subcat == "-- Select --" || subcat == undefined) && (type == "-- Not Customized --" || type == "" || type == undefined))
    {
        $("#divVendorCost").hide();
    }
  }
  ..

Upvotes: 2

palaѕн
palaѕн

Reputation: 73906

Try this:

var stone = $('#chkStone_' + idx).is(':checked');

Since, your data-idx value is "@i" and id value is "chkStone_@i", so you need to add a _ also in the id selection.

Upvotes: 1

Related Questions