Hi,
I am using Infragistics 2011 vol 2 JQUERY Grid. I need to bind the igGrid datasource to the datatable object available at server side .aspx.CS file.
Thanks.
Since you're using ASP.NET, you can create a web service which returns JSON, and point the grid's dataSourceUrl to the web service url. Here is an example about how to bind the grid to a WCF service:
https://www.igniteui.com/help/iggrid-getting-started-with-iggrid-odata-and-wcf-data-services
Select Sample Source File to View => RemoteBinding.html
Hope it helps. Thanks,
Angel
Hi
Thanks for reply.
I have gone through the sample. But as per the requirement we are not looking WCF service.
Is there any possiblity that i can bind JQUERY igGrid (dataSource) directly to server side function written in .CS file that returns data in JSON format.
Hello,
Actually, Dave Ward wrote this article some time ago:
http://encosia.com/using-jquery-to-directly-call-aspnet-ajax-page-methods/
I believe that it has the details you are looking for.
As for the grid, you can simply set the URL to the JSON-returning ASP page method as the grid's dataSource and you should be all set.
However, there are 2 alternative here:
1. You explicitly allow HTTP GET for this page method
or
2. Since ASP.NET defaults to using HTTP POSTs in order to ensure that your pages are secure, it won't work with the grid (or dataSource) directly as they will make GET requests to the dataSource URL (this is a design decision based on the REST standards).In that case you will need to do
$.ajax({ type: "POST", url: "http://Default.aspx/YourPageMethod", data: "{}", contentType: "application/json; charset=utf-8", dataType: "json", success: function(data) {
$("#grid").igGrid({ dataSource: data
}); } });
Angel gave you the nod to WCF services because generally they are the recommended and more beneficial way of having a "service-like" experience.
Hope this helps.Cheers,Borislav
Thanks for update.
By using ig.JSONDataSource we are able to bind data to the grid. Now when user modifies the data on the igGrid, i need to send this updated datasource object to the web service as input parameter.
Can you please provide an information for the same?
you can refer to the following article:
http://help.infragistics.com/Help/NetAdvantage/jQuery/2011.2/CLR4.0/HTML/igGrid_Updating.html
=> Persisting the changes to the server
Thanks for Reply.
The link was very helpful. Now, i need to the fomatting on the JQUERY igGrid. The following are the requirements:
1. To merge igGrid cells.
2. To set CSS for Cells/Rows/Columns.
I need above urgnet basis.
Thanks in Advance.
I'm trying to return JSon data in regards to a service call (using C# JavaScriptSerializer) and getting an error with the following data (from msg.d in my function).
function getData() { $.ajax({ type: 'POST', url: 'GetPerson.asmx/Person', data: "{SearchCriteria: '" + $("#SearchText").val() + "'}", contentType: 'application/json; charset=utf-8', dataType: 'json', success: function (msg) { //var grid = $("#SearchResults")[0]; //grid.dataSource = msg.d; //grid("dataSourceObject", msg.d); $("#SearchResults").igGrid({ dataSource: msg.d }); }, error: function (xhr, ajaxOptions, thrownError) { alert("Something bad happened. Code: " + xhr.status + ". Error: " + xhr.responseText); } });
JSON result:
[{"Id":1,"Name":"Joe","Age":"33","Address":"Somewhere"},{"Id":2,"Name":"Jack","Age":"31","Address":"Somewhere"},{"Id":3,"Name":"Jill","Age":"23","Address":"Somewhere"}]
Error:
Microsoft JScript runtime error: Syntax error, unrecognized expression:
Here's the full message... Microsoft JScript runtime error: Syntax error, unrecognized expression: [{"Id":1,"Name":"Joe","Age":"33","Address":"Somewhere"},{"Id":2,"Name":"Jack","Age":"31","Address":"Somewhere"},{"Id":3,"Name":"Jill","Age":"3","Address":"Somewhere"}]
Laxmi2012 said:1. To merge igGrid cells.
Laxmi2012 said:2. To set CSS for Cells/Rows/Columns.
Hi triffle,
Actually, I'm not sure I understand you - are you receiving a JavaScript error when accessing the input parameter of your AJAX call's success callback function?Are you sure that that param (msg) really has a property "d"?If possible, can you provide us with a sample project or a piece of dummy data with the same structure you are trying to use for the igGrid?Thanks in advance!
I'm using JQuery-1.7.2 -- this is where the error is occurring.
It happens on this line of jquery: $("#SearchResults").igGrid({ dataSource: msg, dataSourceType: 'json', responseDataKey: 'd' });
Here is the ajax call to get the json data: function getData() { $.ajax({ type: 'POST', url: 'SearchService.asmx/SearchEntity', data: "{SearchCriteria: '" + $("#SearchText").val() + "'}", contentType: 'application/json; charset=utf-8', dataType: 'json', success: function (msg) { //var grid = $("#SearchResults")[0]; //grid.dataSource = msg.d; //grid("dataSourceObject", msg.d);
$("#SearchResults").igGrid({ dataSource: msg, dataSourceType: 'json', responseDataKey: 'd' });
// $("#SearchResults").igGrid("dataSourceObject", msg);// $('#SearchResults').igGrid('dataBind'); }, error: function (xhr, ajaxOptions, thrownError) { alert("Something bad happened. Code: " + xhr.status + ". Error: " + xhr.responseText); } }); } });
I'm using fiddler,here's the fiddler response from calling my web service:
{"d":"[{\"Id\":1,\"Name\":\"Jack\",\"Age\":\"33\",\"Address\":\"Somewhere\"},{\"Id\":2,\"Name\":\"Joe\",\"Age\":\"31\",\"Address\":\"Somewhere\"},{\"Id\":3,\"Name\":\"Jill\",\"Age\":\"24\",\"Address\":\"Somewhere\"}]"}