Cross Domain Requests

[Benji6996Participant]

I have a grid that fetches its data from a different subdomain on my server (same top level domain).

E.g. My site is beta.example.com, and my data comes from api.example.com…

In jQuery, in order to send cookies and credentials etc you need to add the following to an $.ajax call:

xhrFields: {
  withCredentials: true // Make sure cross domain requests are allowed
}

Is there an equivalent for the jqWidgets data adapter/grid? If not, can this be added into the next release?

Thanks in advance

Update

I am not looking for JSONP as this does not send the credentials that I need it to. I must be able to access the cookies from beta.example.com on api.example.com.

[Peter StoevKeymaster]

Hi,

We do not have such setting built-in the jqxDataAdapter, but you may use the jQuery’s Ajax function with it by setting the jqxDataAdapter’s loadServerData callback function. For more information about it and how to implement it, see: http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxdataadapter/jquery-data-adapter.htm

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[Benji6996Participant]

This looks like the perfect solution, thank you!

I have tried to implement this myself but have run into trouble. Am I missing something?

Here is my code:

// Prepare the response data
var source = {
	datatype: "json",
	datafields: [
		{ name: 'reference', map: 'Shipment_Reference' },
		{ name: 'date', map: 'Shipment_Date', type: 'date' },
		{ name: 'so_reference', map: 'Main_SO_Reference' },
		{ name: 'goods_description', map: 'Goods_Description' },
		{ name: 'total', map: 'Base_Total', type: 'float' },
		{ name: 'buyer_details', map: 'Buyer_Address' },
		{ name: 'buyer_reference', map: 'Buyer_Reference' },
		{ name: 'terms_of_delivery', map: 'Terms_Of_Delivery' },
		{ name: 'bol_date', map: 'Bill_Of_Lading_Date', type: 'date' },
		{ name: 'bol_number', map: 'Bill_Of_Lading_Number' }
	]
};
// Get the shipments
var settings = {
	loadServerData: function(serverdata,source,callback){
		MN.ajax({
			url: '//api.domain.net/documents/?'+query,
			dataType: source.datatype,
			success: function(data){
				console.log(data);
				// Send the data to the data adapter
				callback({ records: data });
			},
			error: function(msg){
				console.log('error');	
			}
		});
	}
};
// Initialize the data adapter
var dataAdapter = new $.jqx.dataAdapter(source,settings);

[Peter StoevKeymaster]

Hi,

1. I suppose that the issue here is that “records” is expected to be Array and data is JSON. By default the jqxDataAdapter internally parses the JSON to Array, but as you override the built-in behavior, now you will have to do that manually.

2. Another solution which I can suggest you is to use jqxDataAdapter and pass your custom query as part of the default data passed to the server i.e you may add “formatdata” callback function to your source object and the result of that function will be passed to the server as data. Your “url” parameter of the source object in that case will be ‘//api.domain.net/documents/’;

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[Benji6996Participant]

If ‘records’ is meant to be an array, how does it know which fields to map to which values.

Consider this result structure:

[{"Shipment_Reference":"","Shipment_Date":"","Buyer_Address":"","Buyer_Reference":"","Main_SO_Reference":"","Base_Total":"","Terms_of_Delivery":"","Bill_Of_Lading_Date":,"Bill_Of_Lading_Number":"","Goods_Description":""}]

Whereas, in array format it will just be indexed like so and it cannot be multidimensional:

["0":"","1":"","2":"","3":"","4":"","5":"","6":"","7":"","8":"","9":""]

How should I structure my result?

Update

Furthermore, ‘data.results’ is actually an array or results. My callback now looks like this:

callback({ records: data.results, totalrecords: data.rows });

[Peter StoevKeymaster]

Hi,

Could you send us a sample based on the provided code which we will be able to test locally? You can send it to support@jqwidgets.com.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[Benji6996Participant]

Just sent through, thanks Peter

[Author]

Posts