передача данных из jqGrid в webmethod

Question

Это мой jqGrid, вызывающий веб-метод

$(document).ready(function () {
    jQuery("#prodgrid").jqGrid({
        url: 'product_brow.aspx/ProdGrid',
        postData: {
            ddlproductstatus: function() {
                return  $("#<%=ddlProductStatus.ClientID%>").val();
            },
            ddlproducttype: function() {
                return  $("#<%=ddlProductType.ClientID%>").val();
            }, 
            txtkeywordsearch: function() {
                return  $("#<%=txtKeywordSearch.ClientID%>").val();
            },
            hdnMerchantId: function() {
                return  $("#<%=hdnmerchantId.ClientID%>").val();
            }
        },
        mtype: 'POST',
        serializeEditData: function (postData) {
            return JSON.stringify(postData);
        } ,
        colNames: ['Code', 'Title', 'Price', 'Product Group', 'Edit', 'Status'],
        colModel: [
            { name: 'Code', index: 'Code', width: 15, align: 'center' },
            { name: 'Title', index: 'Title', width: 40, align: 'center' },
            { name: 'Price', index: 'Price', width: 55 },
            { name: 'Product Group', index: 'Product Group', width: 55 },
            { name: 'Edit', index: 'Edit', width: 40 },
            { name: 'Status', index: 'Status', width: 40}],
        pager: '#prod_pager',
        rowList: [10, 20, 30],
        sortname: 'Code',
        sortorder: 'desc',
        rowNum: 10,
        loadtext: "Loading....",
        shrinkToFit: true,
        multiselect: true,
        emptyrecords: "No records to view",
        width: x - 40,
        height: 230,
        rownumbers: true,
        subGrid: true,
        caption: 'Products'
        // editurl: 'Departments.aspx' 
    });
    jQuery("#prodgrid").jqGrid('navGrid', '#prod_pager',
        { edit: false, add: false, del: true, excel: true, search: false });
});

, как вы можете видеть, я пытаюсь передать данные отсюда в веб-метод с такими параметрами, как

[WebMethod]
public static string ProdDetails(string ddlproductstatus,
                                 string ddlproducttype,
                                 string txtkeywordsearch,
                                 string hdnMerchantId)
{
    StringBuilder sbReturnJson = new StringBuilder();
    string strReturnJson = string.Empty;
    StringBuilder sbCell = new StringBuilder();

    try
    {
        string sort = HttpContext.Current.Request.Form["sidx"].ToString();
        string strSortDerection = HttpContext.Current.Request.Form["sord"].ToString();
        int iPage = Convert.ToInt32(HttpContext.Current.Request.Form["page"]);//get the requested page
        string strLimit = HttpContext.Current.Request.Form["rows"].ToString(); // get how many rows we want to have into the grid
        string strStart = Convert.ToString(int.Parse(strLimit) * (iPage - 1));
        string strEnd = Convert.ToString(int.Parse(strStart) + int.Parse(strLimit));

        string pageNo = string.Empty;
        ProductDal oProductDal = new ProductDal();

        // bind data to gridview

        System.Data.DataTable oDataTable;

        if (txtkeywordsearch.Trim().Length == 0)
        {
            oDataTable = oProductDal.GetAllProductDtToDisplayTest(Convert.ToInt32(hdnMerchantId), ddlproducttype,
                ddlproductstatus, iPage, Convert.ToInt32(strLimit));
        }
        else
        {
            oDataTable = oProductDal.GetAllProductDtToDisplayBySearchStringTest(Convert.ToInt32(hdnMerchantId), ddlproducttype,
              ddlproductstatus, txtkeywordsearch.Trim(), iPage, Convert.ToInt32(strLimit));
        }

        // keep values in session to use in product detail page to retrieve records.
        //Session["ProductType"] = ddlproducttype;
      //  Session["ProductStatus"] = ddlproductstatus;

        if (txtkeywordsearch.Trim().Length != 0)
        {
           // Session["SearchKeyword"] = txtkeywordsearch;
        }


        //  hlnkExportToExcel.Visible = false;

        // calculate the total number of records.
        int totalRows = 0;

        if (txtkeywordsearch.Trim().Length == 0)
        {
            totalRows = oProductDal.CountAllProductDtToDisplay(Convert.ToInt32(hdnMerchantId), ddlproducttype,
                    ddlproductstatus);
        }

        else
        {
            totalRows = oProductDal.CountAllProductDtToDisplayBySearchString(Convert.ToInt32(hdnMerchantId), ddlproducttype,
                    ddlproductstatus, txtkeywordsearch.Trim());
        }

        //if (!IsPostBack)
        //{
        //    gvProductBrow.PageIndex = _currentPageNumber;
        //}


        var count = oDataTable.Rows.Count;

        sbReturnJson.Append("{\"page\":\"" + iPage + "\",\"records\":\"" + count + "\",\"rows\":[");
        foreach (DataRow row in oDataTable.Rows)
        {
            // int depid = Convert.ToInt32(row[1].ToString());
            // var Editbutton = "<img Class='GridEdit' onclick='showjQueryDialog(" + depid + ");' src='Images/edit.jpeg'></img>";
            //<a href='#' Class='GridEdit' onclick='showjQueryDialog(" + depid + ");'>Edit</a>
            string code = (row[1].ToString());
            string title = (row[4].ToString());
            string price = (row[7].ToString());
            string product_group = (row[5].ToString());
            string edit = (row[0].ToString());
            string status = (row[2].ToString());

            sbCell.Append("{\"cell\":[\"" + code + "\",\"" + title + "\",\"" + price + "\",\"" + product_group + "\",\"" + edit + "\",\"" + status + "\"]}");
            sbCell.Append(",");
        }

       // lblNoOfRows.Text = totalRows + " record(s) found";

        sbReturnJson.Append(sbCell.ToString().TrimEnd(','));
        double dCount = Math.Ceiling(Convert.ToDouble(count / int.Parse(strLimit)));
        int iCount = int.Parse(dCount.ToString()) + 1;
        sbReturnJson.Append("],\"total\":\"" + iCount + "\"}");

        //lblTopPageNo.Text = (gvProductBrow.PageIndex + 1) + "/" + CalculateTotalPages(totalRows);
        //lblBottomPageNo.Text = (gvProductBrow.PageIndex + 1) + "/" + CalculateTotalPages(totalRows);
        //ViewState["NoOfPages"] = CalculateTotalPages(totalRows);

    }
    catch (Exception ex)
    {
        ExceptionLogger.LogException(ex);
        //lblErrorMessage.Text += Resources.Resource.Product_errMsgLoadProduct;
        return "Error";
    }
    return sbReturnJson.ToString();  
}

мой веб-методожидая 4 параметра, которые я пытаюсь передать, используя postData, но так как я новичок, я не знаю, как отправить данные в веб-метод из моего jqGrid.Нужна помощь, которая застряла с этим примерно на 5 часов

Можете ли вы также помочь с отправкой страницы, sidx, сортировку из jqgrid в веб-метод

Answer 1

Я рекомендую вам использовать веб-сервис ASMX или WCF. В случае, если многие вещи, такие как JSON-сериализация и десериализация, будут сделаны автоматически для вас. Вы должны просто вернуть объект из веб-метода.

Как правило, служба WCF RESTfull имеет преимущества по сравнению с веб-службой ASMX, но если вы новичок, вы можете проще добавить веб-службу ASMX в существующий проект, чтобы все изменения в файле web.config сделали Visual Studio для вас.

Чтобы добавить веб-сервис ASMX в существующий проект ASP.NET, необходимо выполнить следующие шаги. Вы выбираете текущий проект в обозревателе решений (как правило, с правой стороны в Visual Studio) и вводите Ctrl + Shift + A (или щелкните правой кнопкой мыши нажмите кнопку и выберите «Добавить» и «Новый элемент…»), вы должны выбрать «Веб» шаблон с левой стороны, а затем «Веб-сервис». Вы можете изменить имя файла в нижней части по умолчанию WebService1.asmx на любое, что вы хотите. Например ProdData.asmx. В файле ProdData.asmx.cs вы должны раскомментировать строку с атрибутом [ScriptService]. Вы можете дополнительно вставить using System.Web.Script.Services; в начале файла. Теперь вы можете изменить код веб-метода «Hello world» на то, что вам нужно. Например, к

using System.Collections.Generic;
using System.Web.Services;
using System.Web.Script.Services;

namespace TestWebApplicationWithjqGrid
{
    public class GridRow {
        public string id { get; set; }
        public List<string> cell { get; set; }
    }
    public class GridData {
        public int page { get; set; }
        public int total { get; set; }
        public int records { get; set; }
        public List<GridRow> rows { get; set; }
    }
    [WebService (Namespace = "http://tempuri.org/")]
    [WebServiceBinding (ConformsTo = WsiProfiles.BasicProfile1_1)]
    [System.ComponentModel.ToolboxItem (false)]
    [ScriptService]
    public class ProdData: WebService
    {
        [WebMethod]
        public GridData ProdDetails(string sidx, string sord, int page, int rows,
                                    string ddlproductstatus, string ddlproducttype, string txtkeywordsearch, int hdnMerchantId) {
            return new GridData {page = 1, total = 1, records = 2, rows = new List<GridRow> {
                new GridRow {id = "i1", cell = new List<string> {"Code1", "Title1", "Price1", "Group1", "Edit1", "Status1"}},
                new GridRow {id = "i2", cell = new List<string> {"Code2", "Title2", "Price2", "Group2", "Edit2", "Status2"}}
            }};
        }
    }
}

Конечно, вы должны иметь более сложную реализацию веб-метода ProdDetails. Ответ дает вам примеры. См. Дополнительно этот ответ для получения дополнительных ссылок с примерами кода.

Чтобы вызвать веб-метод из JavaScript, вы должны немного изменить jqGrid. Вы должны включить следующие дополнительные параметры

datatype: 'json',
ajaxGridOptions: { contentType: "application/json"},
serializeGridData: function (postData) {
    var propertyName, propertyValue, dataToSend = {};
    for (propertyName in postData) {
        if (postData.hasOwnProperty(propertyName)) {
            propertyValue = postData[propertyName];
            if ($.isFunction(propertyValue)) {
                dataToSend[propertyName] = propertyValue();
            } else {
                dataToSend[propertyName] = propertyValue
            }
        }
    }
    return JSON.stringify(dataToSend);
},
jsonReader: {
    root: "d.rows",
    page: "d.page",
    total: "d.total",
    records: "d.records"
}

Код serializeGridData Я получаю от моего предыдущего ответа . Это сложнее, чем просто

serializeGridData: function (postData) { return JSON.stringify(postData); }

используется в большинстве случаев, потому что вы используете функции внутри postData.

Здесь вы можете скачать VS2010 .NET 3.5 рабочий проект с соответствующим кодом.