We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Set and Get CheckBox value programmatically with Jquery

With other syncfusion controls, when I have to assign them a value, when the view is first loaded I do something like this:

(this is an example with control maskedit)

$('#Surname').ejMaskEdit({
            value:'@Model.Person_Surname'
        });

-> this approach doesn't work with checkbox:

form.find('#CheckBox').ejCheckBox({
            value: '@Model.Interaction_Flag'
                });

..and this doesn't work either:

form.find('#CheckBox').ejCheckBox({
            checked: '@Model.Interaction_Flag'
                });

Also, about recovering a value (for example to prepare the JSON for an ajax call), I usually do something like this:

Person_Surname: $('#Surname').val()

with checkboxes I have tried the following, which doesn't work:

Interaction_Flag: $('#CustomCheck').val()

..and this doesn't work either:

Interaction_Flag: form.find('#CustomCheck').checked()

More generally speaking, what is the general best approach to handle these GET / SET scenarios with syncfusion controls? Thanks

2 Replies

CA Carlo July 29, 2015 08:10 AM UTC

Just a quick upgrade; at the moment I solved the issue doing the following - very ugly - solution:

  • I declare the control like this: (1)
<input type='checkbox' id='CheckBox' />
  • Then I set it to be an ejCheckBox and recover the value from the model this way: (2)

form.find('#CheckBox').ejCheckBox({
            checked: @Json.Encode(@Model.Interaction_Flag),
        });

  • Finally, when I need to get the checkbox value (to prepare a JSON), I do this (which is the ugly part): (3)
form.find('#CheckBox').data('ejCheckBox')._isChecked

Regarding this last part (3), I also tried to do this:

form.find('#CheckBox').prop('checked') 

but that fails to get the correct checkbox value if the checked state was set to true by the code at (2) and not by the user. I'd really like to know if I'm following the best approach to handle the scenario, especially regarding the code at (3), which seems to be very ugly (isn't _isChecked a private property after all?)


SN Sasikala Nagarajan Syncfusion Team July 29, 2015 11:38 AM UTC

Hi Carlo,

Thanks for using Syncfusion products,

We can get and set the check box checked state using checked property(Boolean type – true/false).

Please refer the below code snippet to set the value to checkbox at that time of initialization.
[html]
<input type="checkbox" id="check1" />

[script]
$("#check1").ejCheckBox({checked:true});



We can get the check box’s checked state from object of the checkbox. Please refer the below code snippet to get the checked state of ejcheckbox
[script]
obj = $("#check1").ejCheckBox('instance');
obj.option("checked");


Please refer the below link to know more about possible methods to get and set the properties of ej controls

http://helpjs.syncfusion.com/js/api-configuration

We have prepared the simple sample based on this. Please refer the below link
http://jsplayground.syncfusion.com/31f4zqth

Please check with given links and let us know if you have further queries,

Regards,

Sasikala Nagarajan

Loader.
Live Chat Icon For mobile
Up arrow icon