Carica i dati da Webservice (asmx) a jqgrid. mi aiuti per favore

Creo un campione per testare jqgrid.

GetDataService.asmx:

using System; using System.Collections; using System.ComponentModel; using System.Data; using System.Linq; using System.Web; using System.Web.Services; using System.Web.Services.Protocols; using System.Xml.Linq; using System.Web.Script.Services; using System.Web.Script.Serialization; using System.Collections.Generic; using System.Data.SqlClient; namespace ExampleJqGrid { ///  /// Summary description for GetDataService ///  [WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [ScriptService] [ToolboxItem(false)] // To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. // [System.Web.Script.Services.ScriptService] public class GetDataService : System.Web.Services.WebService { [WebMethod] public string GetProduct() { SqlConnection con = new SqlConnection(@"Data Source=NGUYEN-LAPTOP\SQLEXPRESS;Initial Catalog=ProductDB;Integrated Security=True"); //SqlCommand cmd = new SqlCommand("SELECT * FROM Products", con); SqlDataAdapter da = new SqlDataAdapter("SELECT * FROM Products", con); DataSet ds = new DataSet(); da.Fill(ds); DataTable dt = ds.Tables[0]; GetJSONFromDataTable getJsonDataTable = new GetJSONFromDataTable(); string json = getJsonDataTable.GetJSONString(dt); string jonsData = GetJSONFromDataTable.JsonForJqgrid(dt, 10, 10, 2); return jonsData; } } } 

GetJSONFromDataTable.cs

 using System; using System.Data; using System.Configuration; using System.Linq; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.HtmlControls; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Xml.Linq; using System.Text; using System.Web.Script.Serialization; namespace ExampleJqGrid { public class GetJSONFromDataTable {public static string JsonForJqgrid(DataTable dt, int pageSize, int totalRecords,int page) { int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize); StringBuilder jsonBuilder = new StringBuilder(); jsonBuilder.Append("{"); jsonBuilder.Append("\"total\":" + totalPages + ",\"page\":" + page + ",\"records\":" + (totalRecords) + ",\"rows\""); jsonBuilder.Append(":["); for (int i = 0; i < dt.Rows.Count; i++) { jsonBuilder.Append("{\"i\":"+ (i) +",\"cell\":["); for (int j = 0; j < dt.Columns.Count; j++) { jsonBuilder.Append("\""); jsonBuilder.Append(dt.Rows[i][j].ToString()); jsonBuilder.Append("\","); } jsonBuilder.Remove(jsonBuilder.Length - 1, 1); jsonBuilder.Append("]},"); } jsonBuilder.Remove(jsonBuilder.Length - 1, 1); jsonBuilder.Append("]"); jsonBuilder.Append("}"); return jsonBuilder.ToString(); } } } 

GetJSONFromDataTable.cs

 public static string JsonForJqgrid(DataTable dt, int pageSize, int totalRecords,int page) { int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize); StringBuilder jsonBuilder = new StringBuilder(); jsonBuilder.Append("{"); jsonBuilder.Append("\"total\":" + totalPages + ",\"page\":" + page + ",\"records\":" + (totalRecords) + ",\"rows\""); jsonBuilder.Append(":["); for (int i = 0; i < dt.Rows.Count; i++) { jsonBuilder.Append("{\"i\":"+ (i) +",\"cell\":["); for (int j = 0; j < dt.Columns.Count; j++) { jsonBuilder.Append("\""); jsonBuilder.Append(dt.Rows[i][j].ToString()); jsonBuilder.Append("\","); } jsonBuilder.Remove(jsonBuilder.Length - 1, 1); jsonBuilder.Append("]},"); } jsonBuilder.Remove(jsonBuilder.Length - 1, 1); jsonBuilder.Append("]"); jsonBuilder.Append("}"); return jsonBuilder.ToString(); } 

default.asp

  

            function getProducts() { $.ajax({ url: "/GetDataService.asmx/GetProduct", data:"{}", // For empty input data use "{}", dataType: "json", type: "'GET'", contentType: "application/json; charset=utf-8", //success: successFunction /*complete*/success: function(jsondata) { alert(jsondata); var thegrid = jQuery("#list")[0]; thegrid.addJSONData(JSON.parse(jsondata)); } }); } function dataBindToGrid() { jQuery("#list").jqGrid({ datatype: getProducts(), colNames: ['ProductId', 'ProductName', 'Description', 'Price'], colModel: [{ name: 'ProductId', index: 'ProductId', width: 200, align: 'left' }, { name: 'ProductName', index: 'ProductName', width: 200, align: 'left' }, { name: 'Description', index: 'Description', width: 200, align: 'left' }, { name: 'Price', index: 'Price', width: 200, align: 'left' } ], rowNum: 10, rowList: [5, 10, 20, 50, 100], pager: jQuery('#pager'), //imgpath: '', imgpath: '~/Resources/themes/redmond/images', width: 300, viewrecords: true }).navGrid(pager, { edit: true, add: false, del: false, search: false }); } jQuery(document).ready(function() { $("#btnAdd").click(dataBindToGrid); });  

  

Quando allarme la stringa jsondata, restituisce null.

Si prega di rivedere e aiutarmi a caricare i dati su jqgrid

I migliori saluti

L’esempio ha molti problemi. Per esempio

  • Se si utilizza l’ [WebMethod, ScriptMethod(ResponseFormat = ResponseFormat.Json)] sul metodo web e [ScriptService] nella class del servizio Web, il parametro di output verrà automaticamente convertito in JSON . (vedi asmx web service, json, javascript / jquery? per esempio). Quindi non è necessario implementare le funzioni come JsonForJqgrid .
  • Usi un modello molto vecchio per il tuo programma. L’utilizzo di datatype come funzione per i dati JSON non è più necessario. L’uso di parametri jqGrid molto vecchi imgpath e class="scroll" in HTML che non vengono più utilizzati poiché molte versioni di jqGrid mostrano anche che si utilizza un modello molto vecchio per il proprio programma.
  • piccoli errori come type: "'GET'" invece di type: 'GET' o type: "GET" .

Se seguirai la strada con l’uso del datatype di datatype come funzione, riceverai dei problemi se decidessi di implementare l’impaginazione dei dati della ricerca nella tua applicazione.

Vi consiglio di guardare meglio ad altri esempi come jqgrid Pagina 1 di x pager , jqgrid setGridParam tipo dati: local o jquery con ASP.NET MVC – chiamata a servizio web abilitato ajax . Puoi anche scaricare un esempio funzionante http://www.ok-soft-gmbh.com/jqGrid/WebServicesPostToJqGrid.zip che ho creato come parte di http://www.trirand.com/blog/?page_id=393 / help / pager-not-working-per-me-dove-am-i-doing- risposta sbagliata o http://www.ok-soft-gmbh.com/jqGrid/VS2008jQueryMVC.zip o http: // www. ok-soft-gmbh.com/jqGrid/jQueryMVC.zip (vedi l’altra jquery di una vecchia risposta con ASP.NET MVC – chiamando il servizio web abilitato ajax )

AGGIORNATO : hai anche l’ordine sbagliato dei file JavaScript. ui.multiselect.css non è stato caricato come tutto. Dovresti cambiarlo in

L’inclusione di jqDnR.js e jqModal.js non è necessaria. Dovrebbe essere una parte di jquery.jqGrid.js se si controllano i moduli corrispondenti durante il download di jqGrid . jquery.layout.js non sono necessari per jqGrid. Dovresti includerlo solo se lo usi separatamente.