Question

你好，我想在日期更改时通过javascript在表中添加表...数据来自数据库并添加到表中。

但是问题在于表行没有生成。

这是我的控制器

 [HttpPost]
    public ActionResult DateWiseData(DateTime SelectedDate)
    {
        var Dw = DateTime.Now.ToShortDateString();
        var idparam = new SqlParameter
        {
            ParameterName = "date",
            Value = SelectedDate
        };
        var waxlist = Db.Database.SqlQuery<PRCWax>("exec sp_PRCWax_Get_Date @date", idparam).ToList();
        return Json(waxlist, JsonRequestBehavior.AllowGet);

    }

这是我的JavaScript

 $("#DT").on("change", function () {
            var selectedValue = $(this).val();
            $.ajax({
                type: "POST",
                url: '@Url.Action("DateWiseData", "ProcessWax")',
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify({ 'SelectedDate': selectedValue }),
                success: function (waxlist) {
                    if (Object.keys(waxlist).length > 0) {
                        $('#detailtbl').append('<div class="card">' +
                                                   '<div class="card-header card-header-primary card-header-icon">' +
                                                   '<div class="card-icon"><i class="material-icons">assignment</i>' +
                                                   '</div><h4 class="card-title">DataTables.net</h4></div>' +
                                                   '<div class="card-body">' +
                                                   '<div class="toolbar"><!-- Here you can write extra buttons/actions for the toolbar --></div>' +
                                                   '<div class="material-datatables">' +
                                                   '<table id="datatables" class="table table-striped table-no-bordered table-hover" cellspacing="0" width="100%" style="width:100%">' +
                                                   '<thead>' +
                                                   '<tr>' +
                                                   '<th>PRC no</th>' +
                                                   '<th>Die No</th>' +
                                                   '<th>Description</th>' +
                                                   '<th>Metal</th>' +
                                                   '<th>Qty</th>' +
                                                   '<th>Reject Qty</th>' +
                                                   '<th>Total Weight</th>' +
                                                   '<th>Username</th>' +
                                                   '</tr>' +
                                                   '</thead>' +
                                                   '<tbody>' +
                                               waxlist.forEach(function (data) {
                                                   alert('Successfully done.');
                                                   '<tr>' +
                                                   '<td>' + data.PRCNO + '</td>' +
                                                   '<td>' + data.MOULDCODE + '</td>' +
                                                   '<td>' + data.DESCRIPTION + '</td>' +
                                                   '<td>' + data.METALNAME + '</td>' +
                                                   '<td>' + data.QTY1 + data.QTY2 + '</td>' +
                                                   '<td>' + data.REJECTQTY1 + data.REJECTQTY2 + '</td>' +
                                                   '<td>' + data.PRCNO + '</td>' +
                                                   '<td>' + data.PRCNO + '</td>' +
                                                   '</tr>'
                                               }),
                                                   +'</tbody>' +
                                                   '</table>' +
                                                   '</div>' +
                                                   '</div>' +
                                                   '</div>');
                    }
                },
                //error: function () { alert('Error. Please try again.'); }
            });
        });

这是控制台中显示的我的蜡表结构 Waxlist structure image

运行此代码“成功完成”警报，直到数据具有值为止。但是在表行未生成后……

我在代码中有错的地方..请告诉我如何解决此问题。？

Answer 1

尝试一下

 var htmlData = "";
        htmlData += '<div class="card">' +
            '<div class="card-header card-header-primary card-header-icon">' +
            '<div class="card-icon"><i class="material-icons">assignment</i>' +
            '</div><h4 class="card-title">DataTables.net</h4></div>' +
            '<div class="card-body">' +
            '<div class="toolbar"><!-- Here you can write extra buttons/actions for the toolbar --></div>' +
            '<div class="material-datatables">' +
            '<table id="datatables" class="table table-striped table-no-bordered table-hover" cellspacing="0" width="100%" style="width:100%">' +
            '<thead>' +
            '<tr>' +
            '<th>PRC no</th>' +
            '<th>Die No</th>' +
            '<th>Description</th>' +
            '<th>Metal</th>' +
            '<th>Qty</th>' +
            '<th>Reject Qty</th>' +
            '<th>Total Weight</th>' +
            '<th>Username</th>' +
            '</tr>' +
            '</thead>' +
            '<tbody>';
        waxlist.forEach(function (data) {

            htmlData += '<tr>' +
                '<td>' + data.PRCNO + '</td>' +
                '<td>' + data.MOULDCODE + '</td>' +
                '<td>' + data.DESCRIPTION + '</td>' +
                '<td>' + data.METALNAME + '</td>' +
                '<td>' + data.QTY1 + data.QTY2 + '</td>' +
                '<td>' + data.REJECTQTY1 + data.REJECTQTY2 + '</td>' +
                '<td>' + data.PRCNO + '</td>' +
                '<td>' + data.PRCNO + '</td>' +
                '</tr>'
        });

        htmlData += '</tbody>' +
            '</table>' +
            '</div>' +
            '</div>' +
            '</div>';
        $("#detailtbl").append(htmlData);

表格行未通过javascript

1 个答案: