Can't set preselected values

[MaksvParticipant]

Hello!
I can’t preselect values from database to dynamicaly created comboboxes.
Here is my code:

$("#editBtn").on('click', function() {

						var selectedrowindex = $("#jqxgrid").jqxGrid('getselectedrowindex');
						var dataRecord = $("#jqxgrid").jqxGrid('getrowdata',selectedrowindex);

						/*Get preselected values from database */
						var source = {
							datatype : "json",
							datafields : [ {
								name : 'id',
								type : 'float'
							}, {
								name : 'name',
								type : 'string'
							} ],
			url : '<s:url namespace ="/doctor" action="getDoctorSpeciality?id='+ dataRecord.id+ '"/>'
									};	
						
					
						var dataAdapter = new $.jqx.dataAdapter(source,
								{autoBind:true,
								loadComplete : function(records) {
								// get data records.
								var length = records.length;
								// loop through the records and display them in a table.													
									for (var i = 0; i < length; i++) {																
											var record = records[i];
											_addComboBox(record.name);
								};
						},
						loadError : function(jqXHR,status,error) {},
						beforeLoadComplete : function(records) {}
						});

						
                                             /*Create new combobox*/						
						function _addComboBox (value) {
							
							/*Get all values from database */
							var source = {
								datatype : "json",
								datafields : [ {
									name : 'id',
									type : 'float'
								}, {
									name : 'name',
									type : 'string'
								} ],
								url : '<s:url namespace ="/doctor" action="jsonSpeciality"/>'
										};	
							
						
							var dataAdapter = new $.jqx.dataAdapter(source);
									
						
							
							var comboBoxTag=$('<p id="doctorSpeciality[]"></p>');
			
							$(comboBoxTag).jqxComboBox({source : dataAdapter,
				 	   					displayMember : "name",
										valueMember : "id",
										width : 200,
										height : 20,
										autoDropDownHeight : true
									});
						/*tying to set value */		
						<strong>$(comboBoxTag).jqxComboBox('val',value);</strong>
						$("#addRow").before(comboBoxTag);
									
							};
					}
					)

[Peter StoevKeymaster]

Hi Maksv,

In order to select an item, the ComboBox should have items. In the provided code, you bind the ComboBox through Ajax which means that your code for selection should go into a “bindingComplete” event handler or in the dataAdapter’s loadComplete callback function.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[MaksvParticipant]

Hi Peter,
actually I have tried to set the value in loadComplete callback function and it works right if I have only one combobox.
If I have two or more comboboxes than loadComplete function fires only after the last created combobox.
The same situation with “bindingComplete” event handler.
May be I should have different dataAdapters for each combobox?

....
$(comboBoxTag).jqxComboBox({source : dataAdapter,
	displayMember : "name",
	valueMember : "id",
	width : 200,
	height : 20,
	autoDropDownHeight : true
	});
$(comboBoxTag).on("bindingComplete", function (event) {
$(comboBoxTag).jqxComboBox('val',value);	}); 
...

[Peter StoevKeymaster]

Hi Maksv,

Each ComboBox should have its own dataAdapter.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[MaksvParticipant]

Hi Peter,
thank you for replies.
Yeahp, it works fine.

[Peter StoevKeymaster]

Thank you for using jQWidgets!

[Author]

Posts