Dropdown content by AJAX loading successfullyy, but not listing

[jusmasParticipant]

HI..
I am simply loading a JSON stream to a dropdownlist through Ajax. However, the dropdown seems empty, but the loadComplete() gives the number of records and I am able to display each record as an alert message. The issue here is the JSON data does not list into the dropdown. The funny thing is that if I put the same JSON data as a static variable and make the adapter loading to “local”, then the dropdown will list it. There is no load error shown.

Here is the JS file segment and PHP file

var car_types_data = {
					datatype: "json",
					type: "GET",
	                datafields: [
			                        {name:'car_id',   type:'string'},
			                        {name:'car_type', type:'string'},
			                    ],
	        		id: "car_id",
	            	url: "abcd.php",
	             	async: false,
	             	processdata: function (data) {
					if ($("#locality").jqxComboBox('getSelectedItem')!="") locality=$("#locality").jqxComboBox('getSelectedItem'); else locality="";
		                 	
		                 	data.from_city       = $("#pickup_cities").jqxComboBox('getSelectedItem').label,
		                 	data.from_city_dummy = $("#cityid_selected").val(),
		                 	data.locality_airport= locality,
		                  	data.pickup_date     = $("#journey_date").val(),
		                  	data.pickup_time     = $("#pick_time").val(),
		                 	data.trip_type       = 1,
		                 	data.trip_sub_type	 = 1
			           }
   				}

	            var dataAdapter_cars   = new $.jqx.dataAdapter(car_types_data, {
	                   	loadComplete: function() {
		                	   var records = dataAdapter_cars.records;
		                       var length = records.length;
		                       alert(length);

		                       for (var i = 0; i < length; i++) {
		                           var record = records[i];
		                           html="";
		                           html += record.car_id + " | ";
		                           html += record.car_type + " | ";
		                           alert(html);
		                       }

		                   	},
	            		loadError: function (xhr, status, error) {
		            			alert(JSON.stringify(xhr)); 
		            		}
	               });

And here is the sample PHP script:

<?php
echo '[
		{"car_id":"3","car_type":"AC Economy"},
		{"car_id":"4","car_type":"AC Mid-Size"}
	]';
?>

[Peter StoevKeymaster]

Hi jusmas,

There is no data binding core in your post. Please, look at this demo: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxdropdownlist/bindingtojson.htm?arctic to learn how to data bind the DropDownList widget.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[jusmasParticipant]

Hi.. data binding is triggered on change of some other controls.. However, I have identified the problem.. If I remove the “data.XXX=” lines in the “processdata” routine, the data will be listed in the dropdown. These lines are there to set the value of GET variables to be passed to the AJAX URL. Now, if I remove, I have to define the Full URL in the “URL: ” part, including the query string also. If I construct the querystring before this portion, it returns some error as query string values include a combobox selection value also but combobox declaration is coming in the bottom only.

Please help..

[Peter StoevKeymaster]

Hi jusmas,

The provided code is incomplete and I don’t know how I can help. In your processdata, you use things which are undefined and unknown for me. Please, provide a full jsfiddle.net example to help me understand your situation.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts