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.
Unfortunately, activation email could not send to your email. Please try again.

CheckBox and Data Binding

Thread ID:

Created:

Updated:

Platform:

Replies:

119836 Aug 6,2015 01:52 AM Aug 7,2015 03:10 PM LightSwitch HTML 1
loading
Tags: General
Thomas Steschulat
Asked On August 6, 2015 01:52 AM

Hello,
i read about the ejCheckBox and ejRadiobutton implemantation in another post here.
But the example has no Data Binding.

1. Can you explain to me how i can do the Data Binding for your CheckBox Control?
2. And how can i configure the CheckBox Control as a Three State CheckBox?

Looking at the ej.checkbox.js i see that the ejcheckbox has the capability do work as a Three State Checkbox but im new to js and cant work how out how to to this.

Kind Regards
Thomas

Sasikala Nagarajan [Syncfusion]
Replied On August 7, 2015 03:10 PM

Hi Thomas,


Thanks for the update,


1. Can you explain to me how i can do the Data Binding for your CheckBox Control?

We can bind the Boolean type fields of data source to checkbox control. Please refer the below link to know about data binding in light switch

myapp.AddEditpassengerItem.Seniorcitizen_render = function (element, contentItem) {

// Write code here.


var itemTemplate = $("<input type='checkbox'id='check' data-role='none'/>");

itemTemplate.appendTo($(element));

itemTemplate.ejCheckBox({

enableTriState:true,

change: function (args) {

contentItem.value = args.isChecked;

}

});


contentItem.dataBind('value', function (value) {

itemTemplate.ejCheckBox({ checked: value });

});
};



Here, “isChecked” argument return the true or false based on the state of checkbox.

We have prepared the sample with checkbox databinding. Please get the sample from below location

Sample location

In this sample we have added Seniorcitizen field as Boolean type field in data source and rendered the checkbox as custom control then bind the data(checked status) as specified in above code snippet in checkbox change event.

2. And how can i configure the CheckBox Control as a Three State CheckBox?
We can enable tri state in checkbox control using enableTriState property. In this state, we can get the checked state of the checkbox using “checkState” property.
Please refer the below code snippet to enable the tri state in check box.

myapp.AddEditpassengerItem.Seniorcitizen_render = function (element, contentItem) {

// Write code here.


var itemTemplate = $("<input type='checkbox'id='check' data-role='none'/>");

itemTemplate.appendTo($(element));

itemTemplate.ejCheckBox({

enableTriState:true,

change: function (args) {

contentItem.value = args.isChecked;

}

});



To know more about available properties please refer the below link

http://helpjs.syncfusion.com/js

To know about API configuration to our JS controls Please refer the below link

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

Also, we have logged an issue in change event’s isChecked argument (isChecked return true for intermediate state also instead of returns the null) in our database. A new support incident (142433) to track the status of this issue has been created under your account. Please follow incident for further queries related to this issue.

Please let us know if you have further queries,

Regards,
Sasikala Nagarajan


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;