Connecting JQGRID with MYSQL & ASP.NET

Im Currently Stack on how to display all the data of my database im new in using JQGRID and i dont know why is my data dont display when i deployed it on web using localhost

getdata.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Configuration;
using System.Web.Services;
using System.Web.Script.Services;
using MySql.Data.MySqlClient;

public partial class getdata : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    public struct s_GridResult
    {
        public int page;
        public int total;
        public int record;
        public s_RowData[] rows;

    }
    public struct s_RowData
    {
        public int id;
        public string[] cell;
    }
    [WebMethod]
    public static s_GridResult GetDataTable(string _search, string nd, int rows, int page,
 string sidx, string sord)
    {

        int startindex = (page - 1);
        int endindex = page;
        string sql = "SELECT ItemCode,PartNumber FROM tblitemcodefromqne";

        DataTable dt = new DataTable();
        MySqlConnection conn = new
MySqlConnection(ConfigurationManager.ConnectionStrings["ConnectionString1"].ConnectionString);
        MySqlDataAdapter adapter = new MySqlDataAdapter(sql, conn);
        adapter.Fill(dt);
        s_GridResult result = new s_GridResult();
        List<s_RowData> rowsadded = new List<s_RowData>();
        int idx = 1;
        foreach (DataRow row in dt.Rows)
        {
            s_RowData newrow = new s_RowData();
            newrow.id = idx++;
            newrow.cell = new string[2];  //total number of columns
            newrow.cell[0] = row[0].ToString();
            newrow.cell[1] = row[1].ToString();
            rowsadded.Add(newrow);
        }
        result.rows = rowsadded.ToArray();
        result.page = page;
        result.total = dt.Rows.Count;
        result.record = rowsadded.Count;
        return result;
    }

}

getdata.aspx

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1
/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
     <link rel="Stylesheet" type="text/css" media="screen" ="JQGridReq/jquery-
ui-1.9.2.custom.css" />
     <link rel="Stylesheet" type="text/css" media="screen" ="JQGridReq/ui.jqgrid.css" />
     <link rel="Stylesheet" type="text/css" media="screen" ="Themes/style.css" />

     <script type="text/javascript" src="JQGridReq/jquery-1.9.0.min.js"></script>
     <script type="text/javascript" src="JQGridReq/jquery.json-2.2.min.js"></script>
     <script type="text/javascript" src="JQGridReq/jquery-ui-1.9.4.custom.min.js"></script>
     <script type="text/javascript" src="JQGridReq/grid.locale-en.js"></script>
     <script type="text/javascript" src="JQGridReq/jquery.jqGrid.js"></script>

      <script type="text/javascript" >
          $(document).ready(function () {
              $.extend($.jgrid.defaults,
                  { datatype: json },
                  { ajaxGridOptions: { contentType: "application/json",
                      success: function (data, textStatus) {
                          if (textStatus == "success") {
                              var thegrid = $("#Grid1")[0];
                              thegrid.addJSONData(data.d);
                              thegrid.grid.hDiv.loading = false;
                              switch (thegrid.p.loadui) {
                                  case "disable":
                                      break;
                                  case "enable":
                                      $("#load_" + thegrid.p.id).hide();
                                      break;
                                  case "block":
                                      $("#lui_" + thegrid.p.id).hide();
                                      $("#load_" + thegrid.p.id).hide();
                                      break;
                              }
                          }
                      }
                  }

                  });

              jQuery("#Grid1").jqGrid({
                  url: getdata.aspx/GetDataTable,
                  datatype: json,
                  mtype: POST,
                  colNames: [Item Code, Part Number],
                  colModel: [{ name: ItemCode, index: ItemCode, width: 200 },
                   { name: PartNumber, index: PartNumber, width: 300}],
                  pager: #pager, sortname: ItemCode,
                  viewrecoreds: true,
                  imgpath: JQGridReq/images,
                  serializeGridData: function (data) {
                      return $.toJSON(data);
                  }

              });
          });

     </script>
</head>
<body>
    <form id="form1" runat="server">
    <table id="Grid1" class="scroll" align="center" width="100%"></table>
    <div id="pager" class="scroll" style="text-align:center;">

    </div>
    </form>
</body>
</html>


Download connecting.jqgrid.with.mysql.asp.net.zip
Direct Link


Download


Download connecting.jqgrid.with.mysql.asp.net.zip
Mediafire


Download


Download connecting.jqgrid.with.mysql.asp.net.zip
Letitbit


Download

Both comments and pings are currently closed.

Comments are closed.