Detect whether a checkbox is checked or not in asp.net and javascript

Question

I have a CheckBox control within a asp:Panel like below:

<asp:Panel ID="chk" runat="server" Visible="false" CssClass="checkbox checkbox-primary checkbox-single">
    <asp:CheckBox runat="server" ID="valCheck" />
</asp:Panel>

I need to be able to check to see if this CheckBox is being checked or not then I would send 0 or 1 to a function that will do some more stuff and when comes back based on the value, if it's more than 0 it will display a checked check box. I need to use this value, because I also have some other types of inputs as well which I set their value based on the value coming back from another call.

var checking = false;
function saveCheckBoxData(obj, id, inputType) {
    if (checking) return;
    checking = true;
    var date = $("#MainContent_date").val();
    var column = $(obj).attr("column");
    var dataFieldId = $(obj).attr("dataFieldId ");
    var shift = $(obj).attr("shift");
    var val = 0;
    //if ($("#valCheck").is(':checked')) {
    //    val = 1;
    //}
    //if ($('#valCheck').prop('checked')) {
    //    val = 1;
    //}
    //if ($('#valCheck').attr("checked")) {
    //    val = 1;
    //}
    SaveInput(dataFieldId , shift, inputType, date, column, id, val);
}

When I call SaveInput function, I need to either pass 0 (if checkbox is not checked) or 1 (when it's checked). The lines I've commented out did not work!

Any feedback would be greatly appreciated!

Check in browser that you have got same #valCheck as id to your checkbox — Guruprasad J Rao
– Guruprasad J Rao, Commented Jun 13, 2017 at 12:43
try $('<%=valCheck.ClientID %>').is(':checked') if you have written the js code in same aspx page. — Prashant Shirke
– Prashant Shirke, Commented Jun 13, 2017 at 12:44
I think asp.net change the id while sending the page to browser, so use ClientIDMode="static" in your checkbox field and then try. — Hassan Imam
– Hassan Imam, Commented Jun 13, 2017 at 12:47

Mathiasfc · Accepted Answer · 2017-06-13 12:49:42Z

3

The id is not exactly valCheck when you use runat="server"the element id changes(inspect the element to see the new id), then you need to use the jquery selector like:

$("select[id*='valCheck']")

or

$("select[id$='valCheck']")

or you can simply add the attr ClientIdMode="Static" in your asp element.

<asp:CheckBox runat="server" ID="valCheck" ClientIdMode="Static" />

If you want to understand why it happens, take a look at that article.

edited Jun 13, 2017 at 12:49

answered Jun 13, 2017 at 12:44

Mathiasfc

1,6972 gold badges17 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

zezz Over a year ago

Thanks for your answer. The ClientIdMode="Static" would not work in my case, it will destroy the look and feel of my check boxes! I have more than one check box in every page, so I need to constantly check the status of check boxes. The $("select[id*='valCheck']") will help me to see if this input is a check box, now I need to check the checked/unchecked for each check box. Does this require a loop?

Mathiasfc Over a year ago

@zezz You are welcome, most of the time I use the jquery selector as well.

zezz Over a year ago

Sorry, I edited my first comment, I thought I'd send you a notification in case you missed that!

Mathiasfc Over a year ago

@zezz You can use .each of jquery, going through all the checkboxes: $('input[type=checkbox]').each(function () { if (this.checked){...}});

zezz Over a year ago

var val; $('input[type=checkbox]').each(function () { if (this.checked) { val = 1; } else val = 0; }) It always return true (val = 1), even when I unchecked the check box!!

|

geekbro · Accepted Answer · 2017-06-13 12:43:51Z

2

In plain javascript

 var isChecked= document.getElementById("myCheck").checked;

isChecked will be true if checked and false if not checked

answered Jun 13, 2017 at 12:43

geekbro

1,33312 silver badges14 bronze badges

Collectives™ on Stack Overflow

Detect whether a checkbox is checked or not in asp.net and javascript

2 Answers 2

8 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related