使用ASP.NET Web Form将JQGrid数据导出到Excel

Question

使用ASP.NET Web Form导出到Excel的JQGrid数据。我需要提供导出到excel按钮的选项，然后用户可以从JQGrid导出到excel数据。

以下是我的查询脚本。

<script type="text/javascript">

    $(function () {
        $("#dataGrid").jqGrid({
            url: '<%=ResolveUrl("RegistrationReport.aspx/GetDataFromDB") %>',
            datatype: 'json',
            mtype: 'POST',
            serializeGridData: function (postData) {
                return JSON.stringify(postData);
            },

            ajaxGridOptions: { contentType: "application/json" },
            loadonce: true,


            colNames: ['Candidate Name', 'Candidate Email ID', 'Date of Birth', 'Gender', 'Nationality', 'Ethnicity', 'Country of Origin', 'State of Origin', 'Qualification', 'Specilization', 'Class'],
            colModel: [

                    { name: 'Candidate Name', index: 'Candidate Name', width: 175, stype: 'text' },
                    { name: 'Candidate Email ID', index: 'Candidate Email ID', width: 230, stype: 'text', sortable: true, editable: true },
                    { name: 'Date of Birth', index: 'Date of Birth', formatter: "date", formatoptions: { newformat: "m/d/Y" }, width: 120, editable: true },
                    { name: 'Gender', index: 'Gender', width: 220, editable: true },
                    { name: 'Nationality', index: 'Nationality', width: 150, align: "left", editable: true },
                     { name: 'Ethnicity', index: 'Ethnicity', width: 150, align: "left", editable: true },
                      { name: 'Country of Origin', index: 'Country of Origin', width: 150, align: "left", editable: true },
                       { name: 'State of Origin', index: 'State of Origin', width: 150, align: "left", editable: true },
                     { name: 'Qualification', index: 'Qualification', width: 150, align: "left", editable: true },
                       { name: 'Specilization', index: 'Specilization', width: 220, editable: true },
                         { name: 'Class', index: 'Class', width: 220, editable: true }

                  ],

            //multiselect: true,
            multipleSearch: true,
            pager: '#pager',
            rowNum: 50,
            rowList: [50, 100, 150],
            viewrecords: true,
            gridview: true,
            jsonReader: {
                page: function (obj) { return 1; },
                total: function (obj) { return 1; },
                records: function (obj) { return obj.d.length; },
                root: function (obj) { return obj.d; },
                repeatitems: false,
                id: "0"
            },
            caption: 'Registration report'
          }).navGrid('#pager', { search: true, edit: false, add: false, del: false, searchtext: "Search" });
        jQuery("#dataGrid").jqGrid('navGrid', "#pager", {}, {}, {}, {},
        { multipleSearch: true, closeAfterSearch: true, closeAfterReset: true,
onClose: function () {
    //do work
    return true; // return true to close the search grid
     }
     });
    })
    </script>

以下是我的HTML代码。

<table id="dataGrid" style="text-align: center;">
                </table>
                <div id="pager">
                </div>

使用[WebMethod]和Ajax调用获取服务器端数据。我需要导出JQGrid数据。