Json data is not populat in html table using jQuery ajax in asp.net mvc 5

asp.net-ajax asp.net-mvc entity-framework-6 javascript jquery


I'm building an EE portal where users sign in and then go to the report page. In the report page, he may choose a date range to retrieve details. I want to display the data in an HTML table using jQuery and ajax, but when I try, it doesn't fill. I tried every possible approach, but the desired outcome isn't appearing.

my commanding

    public ActionResult HwportalGetData(DateTime startDate, DateTime endDate)
        SCAN_HW_PortalEntities db = new SCAN_HW_PortalEntities();


            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);
                return Json("Invalid");
        catch (Exception ex)
            return Json(ex);

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



The cshtml I use

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


<script type="text/javascript">

$('#btnShow').click(function (e) {
    var mFromDate = $("#FromDate").val();
    var mToDate1 = $("#ToDate1").val();
        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>");

        error: function () {


9/27/2018 3:07:48 PM

Accepted Answer

9/28/2018 2:00:51 PM

Related Questions


Licensed under: CC-BY-SA with attribution
Not affiliated with Stack Overflow
Licensed under: CC-BY-SA with attribution
Not affiliated with Stack Overflow