How do I bind a checked property to ListBox?

[voriusParticipant]

In the json data set I provide to the data adapter I have a “checked” property which I was hoping the ListBox would honor, and check the ones whose property is true when the ListBox loads, but it doesn’t. Now I am trying to figure out a workaround and I cannot find a callback function where I can do the manual looping to check the ones that need to be checked after the data is loaded.

$.ajax({
			url : "windows/admin/actionTypes.html",
			cache : false,
			contentType : "application/json",
			type : "POST",
			dataType : "json",
			data : JSON.stringify(action)
		}).done(function(data) {
	        var source =
	        {
	            datatype: "json",
	            datafields: [
	                { name: "name" },
	                { name: "actionTypeId" },
	                { name: "checked" }
	            ],
	            id: "actionTypeId",
	            localdata : data
	        };
	        var dataAdapter = new $.jqx.dataAdapter(source);
			$("#adminaction_actionTypesList").jqxListBox({
				width: 200, 
				source: dataAdapter, 
				displayMember: "name", 
				valueMember: "actionTypeId",
				checkboxes: true, 
				height: 155, 
				theme: defaultJqxTheme				
			});
			$("#adminaction_actionTypesList").on('bindingComplete', function (event) {
				debug("binding complete");
				var items = $("#adminaction_actionTypesList").jqxListBox('getItems');
				$(items).each(function(index, item) {
					debug("next item: "+JSON.stringify(item));
					item.checked = (item.originalItem.checked);
					if (item.originalItem.checked)
						$("#adminaction_actionTypesList").jqxListBox('checkIndex', index);
				});
			});
		});

I tried using the bindingComplete callback but I never see my debug output “binding complete” even get called so it apparently is not working the way I thought it does. Is there an alternative callback or better yet a way to bind the checked property on the listbox to my data set’s “checked” property?

[Peter StoevKeymaster]

Hi vorius,

“bindingComplete” would not be fired due to the reason that at the point you bind to that event, the widget’s data binding is already completed. Also, there’s no possibility to bind the “checked” property.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[matthewmoonParticipant]

I know I’m digging up an old topic, but has this changed? Or is it still not possible to bind a checkbox to the data source?

[Peter StoevKeymaster]

Hi matthewmoon,

Why should it be changed? When the binding is completed and you bind to the event after that, why should the event be raised in this case? It should not be. It should be raised when an action occurs and as far as I know, event listener can be called after you add an event listener.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[matthewmoonParticipant]

Less about the event, but more about binding checkbox to the data Adapter result.

[ice79Participant]

matthewmoon
if you want to check some of listbox’s items before greating of listbox via JSON
you can create array like this (in PHP):

$listboxitems[]=array(id’=>’some id’, ‘label’=>’some label’, ‘checked’=>1(checked) or 0(unchecked)) //’checked’ value is numeric (not string)

in JavaScript you create something like this:
var source =
{
datatype: “json”,
datafields: [
{ name: ‘id’ },
{ name: ‘label’ },
{ name: ‘checked’ },
],
id: ‘id’,
localdata: data.listboxitems
};
var dataAdapter = new $.jqx.dataAdapter(source);
$(‘#listbox’).jqxListBox({source: dataAdapter, displayMember: ‘label’, valueMember: ‘id’, height: ‘200px’, checkboxes: true, width: ‘290px’});

and your items will be checked acording ‘checked’ values

[Author]

Posts