使用json获取数据并将数据逐页放置在前端

时间:2018-11-07 08:57:18

标签: c# jquery datatables

我试图使用jQuery从数据库中提取数据并在前端显示数据。我想创建一个具有页码的表,以便在每个页面上提取10条记录。这意味着每单击下一页按钮,我想拉出并显示下10条记录。

以下是我在做什么:

  • 数据存储在Sql Server中。

  • 我想将数据保存为JSON

  • 我正在服务器端处理数据

  • 因此,在数据表中,当发生自动更新时,整个json都会打印在屏幕上

我在下面添加了我的代码,但是使用以下代码,我无法获得下一个新记录。您能帮我正确提取数据吗?

    [HttpPost]
            public ActionResult LoadData()
            {
                var draw = Request.Form.GetValues("draw").FirstOrDefault();
                var start = Request.Form.GetValues("start").FirstOrDefault();
                int id = (Convert.ToInt32(start) + 10) / 10;
                var length = Request.Form.GetValues("length").FirstOrDefault();

                int pageSize = length != null ? Convert.ToInt32(length) : 0;
                int skip = start != null ? Convert.ToInt32(start) : 0;
                int recordsTotal = 0;
                Dictionary<string, string> param = new Dictionary<string, string>();
               param.Add("@UserID", User.Identity.Name);
                 param.Add("@pageNo", id.ToString());

                DataTable dt1 = conobj.ExecuteStoredProcedure("usp_Reports",  param  );
                 conobj .closeDbConnection();
                recordsTotal = dt1.Rows.Count;
                List<MyRequests> myreqList = new List<MyRequests>();
                foreach (DataRow row in dt1.Rows)
                {
                    MyRequests requests = new MyRequests();
                    requests.RequestID = row["RequestID"].ToString();
                    requests.ProjectID = row["ProjectID"].ToString();
                    requests.ProjectName = row["ProjectName"].ToString();
                    requests.scenarioname = row["scenarioname"].ToString();
                    requests.BuildNumber = row["BuildNumber"].ToString();
                    requests.Locale = row["Locale"].ToString();
                    requests.Term = row["Term"].ToString();
                    requests.OS = row["OS"].ToString();
                    requests.Status = row["Status"].ToString();
                    requests.LastUpdate = (DateTime)row["LastUpdate"];
                    requests.UserID = row["UserID"].ToString();
                     myreqList .Add(requests);
                }
                var result = JsonConvert.SerializeObject( myreqList  );

                return Json(new { draw = draw, recordsFiltered = recordsTotal, recordsTotal = recordsTotal, data = result }, JsonRequestBehavior.AllowGet);

            }

C#:前端

    $(function () {
            table = $('#myTable').DataTable({
                "bLengthChange": false,
                "bStateSave": true,
                "processing": true,
                "order": [8, 'desc'],
                "iDisplayLength": 10, //no .of records to show
                "bFilter": true,//search option
                "serverSide": true,
                "bInfo": false,//bottom infor showing x entries of y entries
                "bAutoWidth": false,
                "deferLoading": @ViewBag.TotalRecords,
                "pagingType": "full_numbers",
                "bJQueryUI": false,
                "sDom": 'l<"tblHeading">frtip',
                "oLanguage": {
                    "sSearch": "",
                    "oPaginate": {
                        "sNext": '&#9657;&#9657;',//'&#x25ba;&#x25ba;',
                        "sLast": '&#9657;&#10072;',
                        "sFirst": '&#10072;&#9667;',
                        "sPrevious": '&#9667;&#9667;'// '&#x25c4;&#x25c4;'
                    }
                },
                "ajax": {
                    url: '@Url.Action("LoadData", "MyRequests")',`enter code here`
                    type: "POST"               
                    }

            });

数据详细信息:

    "draw":"2","recordsFiltered":10,"recordsTotal":10,"data":"[{\"RequestID\":\"1378953\",\"ProjectID\":\"PS0075\",\"ProjectName\":\"CAT Server Monitoring\",\"scenarioname\":\"PS0075 - Test MyAcct Dl\",\"BuildNumber\":\"NA\",\"Locale\":\"en-us\",\"Term\":\"30d\",\"OS\":\"enus_Win7_64\",\"Status\":\"completed\",\"LastUpdate\":\"\\/Date(1505477763860)\\/\",\"UserID\":\" test  \"},{\"RequestID\":\"1378952\",\"ProjectID\":\"PS0075\",\"ProjectName\":\"CAT Server Monitoring\",\"scenarioname\":\"PS0075 - Test MyAcct Dl\",\"BuildNumber\":\"NA\",\"Locale\":\"en-us\",\"Term\":\"30d\",\"OS\":\"enus_Win7_32\",\"Status\":\"completed\",\"LastUpdate\":\"\\/Date(1506331684250)\\/\",\"UserID\":\" test  \"},{\"RequestID\":\"1410169\",\"ProjectID\":\"PS0075\",\"ProjectName\":\"CAT Server Monitoring\",\"scenarioname\":\"DAT Update Tool Validation \",\"BuildNumber\":\"174\",\"Locale\":\"en-us\",\"Term\":\"30d\",\"OS\":\"enus_Win10_32_TH2\",\"Status\":\"completed\",\"LastUpdate\":\"\\/Date(1508142155757)\\/\",\"UserID\":\" test  \"},{\"RequestID\":\"1410585\",\"ProjectID\":\"PS0075\",\"ProjectName\":\"CAT Server Monitoring\",\"scenarioname\":\"DAT Update Tool Validation \",\"BuildNumber\":\"1016\",\"Locale\":\"en-us\",\"Term\":\"30d\",\"OS\":\"enus_Win10_32_TH2\",\"Status\":\"completed\",\"LastUpdate\":\"\\/Date(1508150828850)\\/\",\"UserID\":\" test  \"},{\"RequestID\":\"1410585\",\"ProjectID\":\"PS0075\",\"ProjectName\":\"CAT Server Monitoring\",\"scenarioname\":\"DAT Update Tool Validation \",\"BuildNumber\":\"174\",\"Locale\":\"en-us\",\"Term\":\"30d\",\"OS\":\"enus_Win10_32_TH2\",\"Status\":\"completed\",\"LastUpdate\":\"\\/Date(1508150828850)\\/\",\"UserID\":\" test  \"},{\"RequestID\":\"1411036\",\"ProjectID\":\"PS0075\",\"ProjectName\":\"CAT Server Monitoring\",\"scenarioname\":\"DAT Update Tool Validation \",\"BuildNumber\":\"1016\",\"Locale\":\"en-us\",\"Term\":\"30d\",\"OS\":\"enus_Win10_32_TH2\",\"Status\":\"completed\",\"LastUpdate\":\"\\/Date(1508159825850)\\/\",\"UserID\":\" test  \"},{\"RequestID\":\"1411036\",\"ProjectID\":\"PS0075\",\"ProjectName\":\"CAT Server Monitoring\",\"scenarioname\":\"DAT Update Tool Validation \",\"BuildNumber\":\"174\",\"Locale\":\"en-us\",\"Term\":\"30d\",\"OS\":\"enus_Win10_32_TH2\",\"Status\":\"completed\",\"LastUpdate\":\"\\/Date(1508159825850)\\/\",\"UserID\":\" test  \"},{\"RequestID\":\"1412314\",\"ProjectID\":\"PS0075\",\"ProjectName\":\"CAT Server Monitoring\",\"scenarioname\":\"DAT Update Tool Validation \",\"BuildNumber\":\"1016\",\"Locale\":\"en-us\",\"Term\":\"30d\",\"OS\":\"enus_Win10_32_TH2\",\"Status\":\"completed\",\"LastUpdate\":\"\\/Date(1508220305233)\\/\",\"UserID\":\" test  \"},{\"RequestID\":\"1412314\",\"ProjectID\":\"PS0075\",\"ProjectName\":\"CAT Server Monitoring\",\"scenarioname\":\"DAT Update Tool Validation \",\"BuildNumber\":\"174\",\"Locale\":\"en-us\",\"Term\":\"30d\",\"OS\":\"enus_Win10_32_TH2\",\"Status\":\"completed\",\"LastUpdate\":\"\\/Date(1508220305233)\\/\",\"UserID\":\" test  \"},{\"RequestID\":\"1436355\",\"ProjectID\":\"PS1084\",\"ProjectName\":\" BRbizMMA and CR1268 Include standard MMS iOS in MMA\",\"scenarioname\":\"BRBizMMA_MAC\",\"BuildNumber\":\"107\",\"Locale\":\"en-us\",\"Term\":\"1m\",\"OS\":\"enus_mac11\",\"Status\":\"completed\",\"LastUpdate\":\"\\/Date(1509598791460)\\/\",\"UserID\":\"test\"}]"}

存储过程

    CREATE PROCEDURE usp_Reports
    (            
     @UserID varchar(max) ,    
     @pageNo varchar(10)        
    )            
    AS            
    BEGIN            
     SET NOCOUNT ON;      
     declare @endindex int       
     declare @startindex int       
     set @endindex = cast(@pageNo as int )* 10 
--selecting 10 records
select distinct top(10)* from (Select  top (@endindex) R.RequestID,R.ProjectID,R.ProjectName,scenarioname,B.BuildNumber,Locale,Term,OS,Status, LastUpdate,R.UserID, BD.Description          
      from Requests R  (nolock) left join BuildMapping BM (nolock)          ``
      on R.RequestID = BM.RequestID left join Builds B (nolock)          
      on BM.BuildID = B.BuildID left join BatchData BD (nolock)          
      on R.BatchID = BD.BatchID          
      where (R.IsDeleted is null or R.IsDeleted=0) and          
      R.UserID like @UserID order by LastUpdate desc )  tbl order by LastUpdate asc      
    END 

1 个答案:

答案 0 :(得分:0)

您将数据两次编码为JSON格式。

不是C#专家,但请尝试删除var result = JsonConvert.SerializeObject( myreqList );,然后使用下面的代码返回数据。

return Json(new { draw = draw, recordsFiltered = recordsTotal, recordsTotal = recordsTotal, data = myreqList }, JsonRequestBehavior.AllowGet);