在ASP.NET MVC 5中使用jQuery AJAX在HTML表中不填充Json数据

Question

我正在创建一个ee门户，用户登录后即可登录。然后，他将进入报告页面。在报告页面中，他可以选择日期范围以获取详细信息，我想显示日期范围搜索数据使用jQuery和Ajax的html表，当我尝试不填充时，我尝试了每种方法，但结果未到

我的控制器

[HttpGet]
    public ActionResult HwportalGetData(DateTime startDate, DateTime endDate)
    {
        SCAN_HW_PortalEntities db = new SCAN_HW_PortalEntities();



        try
        {

            string _startDate = startDate.ToString("dd-MMM-yyyy");
            string _endDate = endDate.AddDays(1).ToString("dd-MMM-yyyy");




            var result = db.Scan_HW_Terminal.Where(x => x.CreatDate >= startDate && x.CreatDate <= endDate).OrderBy(x => x.EmpID).ToList();

            if (result.ToList().Count > 0)
            {
                TempData["total"] = result.Count.ToString();
                return Json(result, JsonRequestBehavior.AllowGet);
            }
            else
                return Json("Invalid");
        }
        catch (Exception ex)
        {
            return Json(ex);
        }

        // return Json(db.Scan_HW_Terminal.ToList());
    }

}

}

我的cshtml视图

<div class="grid-container" id="DataShowGride">
                    <Table Class="table table-bordered" id="myTable">
                        <thead>
                            <tr>
                                <th>Employee ID</th>
                                <th>Create Date</th>
                                <th>City Name</th>
                                <th>Device Type</th>
                                <th>Status</th>
                                <th>Team Leader Name</th>
                                <th>Serial Number</th>
                            </tr>
                        </thead>

                    </Table>
                </div>

<script type="text/javascript">

$('#btnShow').click(function (e) {
    debugger;
    var mFromDate = $("#FromDate").val();
    var mToDate1 = $("#ToDate1").val();
    //$('#loader').show();
    $.ajax({
        url: '@Url.Action("HwportalGetData", "Home")',
        type: "GET",
        data: {startDate: mFromDate, endDate: mToDate1 },
        //startDate: mFromDate, endDate: mToDate1
        dataType: 'json',
        success: function (data) {
            var tr;
            //Append each row to html table  
            for (var i = 0; i < json.length; i++) {
                tr = $('<tr/>');
                tr.append("<td>" + json[i].EmpID + "</td>");
                tr.append("<td>" + json[i].CreatDate + "</td>");
                tr.append("<td>" + json[i].City + "</td>");
                tr.append("<td>" + json[i].DeviceType + "</td>");
                tr.append("<td>" + json[i].DeviceStatus + "</td>");
                tr.append("<td>" + json[i].TeamLeader + "</td>");
                tr.append("<td>" + json[i].TerminalSlno + "</td>");
                $('#myTable').append(tr);

            }
        },
        error: function () {

        }

    });
});

Answer 1

据我了解，您正在以json对象的形式发送开始和结束日期。 json以非常不同的形式存储日期，并且它已经是字符串，因此转换为字符串不会更改格式。

手动将日期格式更改为dd-mm-yyyy。 另外，很难分辨这是否是您的实际问题，因此在此之前，我建议您调试控制器代码并查看显示的日期格式。

如果您的日期格式不正确，则由于您使用了try catch，因此代码将中断，并且将返回异常消息，而不是您要查找的实际数据，但您并未在视图中显示msg。 在此代码行上放置一个断点：

     var result = db.Scan_HW_Terminal.Where(x => x.CreatDate >= startDate && x.CreatDate <= endDate).OrderBy(x => x.EmpID).ToList();

并检查它是否继续捕获或中断，在这种情况下，变量ex会保留错误msg。 检查错误是什么。 如果我正确使用上述方法应该可以解决您的问题。

我也建议将ActionResult更改为JsonResult。 由于您正在返回Json数据。