Accessing a SharePoint 2013 checkbox with JavaScript?

Question

It seems the way a checkbox renders in SharePoint 2013 server has changed from the way it was rendered in 2010.

When I view the source through the browser I see...

<!-- FieldName="MyCheckboxes"
FieldInternalName="MyCheckboxes"
FieldType="SPFieldMultiChoice"
-->
<span id='WPQ......' data-sp-control='SPFieldMultiChoice' data-sp-options'{&quot;mode&quote;:2,&quot;source&quot;:&quot;MyCheckboxes&quot;}'></span>

My attempt to access the checkboxes with JavaScript:

var checkboxes = document.getElementsByName("MyCheckboxes");
var len = checkboxes.length;
alert(len);

len always returns "0", so it appears I'm not actually accessing the checkboxes (I have 10 or so options).

What am I missing?? How can I retrieve checked boxes using JavaScript?? Thanks in advance for any feedback.

Answer 1

Try getting it by the title like this and checking the status of it:

$("input[title *='MyCheckBoxTitle']").is(function() {

var checked = $(this).is(":checked");


switch(checked){

case true: //Do Something           
     break;
case false: //Do Something          
     break;

}

});

Answer 2

Lazo, THANKS for pointing me in the right direction!! You got me closer, but 'title' didn't work. However, I inspected the checkbox control in Firefox and noticed that the SharePoint generated 'id' always starts with the field name and then adds all the SharePoint gibberish after it. So using the jQuery 'begins with' (^=) I came up with the following. It basically checks the value (checked or not?) for all of the checkbox choices for the given column/field.

$("input[id ^= 'MyCheckboxFieldName']").is(function(){
    var checked = $(this).is(":checked");  //is checkbox checked (true/false)?
    var theVal = $(this).next().text();    //get the label for this checkbox
    alert(checked + " : " + theVal);
});