Uncaught TypeError: Cannot read property 'data' of undefined jquery Jtable

Question

我已经为此问题调查了 12 多个小时，但没有找到任何解决方案。我对 jtable 有很好的了解并且我已经使用它很长时间了。我有一个普通的 div，我想使用 jtable 构建它，所以我从我的应用程序中的旧工作示例复制了代码并对其进行了编辑，但是有一个 javascript 错误出现在控制台中，阻止数据显示在 table 中：

Uncaught TypeError: Cannot read property 'data' of undefined jquery Jtable

这是我的 html 页面：

@model Tuple<List<SIO.Core.Entities.Group>, List<SIO.Core.Entities.WorkFlow>>
@section JavaScript
{

<script type="text/javascript" src="@Url.Content("/Scripts/GroupHandler.js")"></script>
<script type="text/javascript" src="@Url.Content("/Scripts/jquery-ui.js")"></script>
<script type="text/javascript"      src="@Url.Content("/Scripts/jquery.jtable.js")"></script>

}


@{
ViewBag.Title = "المجموعات";
Layout = "~/Views/Shared/_Layout.cshtml";
}



<div id="divBackgroundtask" style="display: none;">
</div>
<div id="indx_divtask">
    <section class="col-md-8 taskPoolfilterSection">

    <div class="form-group">
        <div class="border-top">
        </div>
        <div id="filter" class="panel-body margin-bottom">
            <header class="panel-heading containt-border">
                @ViewBag.Title
            </header>
        </div>


    </div>

    <!-- /.panel-body -->


    <div id="divPleaseWaittask" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="load_div col-sm-offset-2 col-sm-5">
            <div class="  row col-sm-2 col-sm-offset-9">
                <img src="~/Images/Loading.gif" />
            </div>

            <div class="row col-sm-12 txt_wait">
                <b>برجاء الإنتظار حتى إكمال العملية</b>
            </div>
        </div>

    </div>



</section>

<div id="GroupsContainer" class="table-responsive">

</div>

这是我构建 jjavascript 的代码table:

(document).ready(function () {
    $('#GroupsContainer').jtable({
        paging: true,
        sorting: true,
        messages: {
            close: 'اغلاق',
            pagingInfo: 'عرض {0}-{1} من {2}',
            pageSizeChangeLabel: 'تعداد الصف',
            noDataAvailable: 'لا يوجد بيانات للعرض!',
            gotoPageLabel: 'الذهاب الى صفحة',
            serverCommunicationError: 'حدث خطأ ما اثناء الإتصال...',
        },

        actions: {
            //listAction: '/TaskPool/GetTasks?isAdmin=' + IsAdmin,
            listAction: function (postData, jtParams) {
                // alert("Loading...");
                PleaseWaitDialogtask.show(true);
                return $.Deferred(function ($dfd) {
                    $.ajax({
                        url: '/Group/GetAllGroups?' + 'jtStartIndex=' + jtParams.jtStartIndex + '&jtPageSize=' + jtParams.jtPageSize + '&jtSorting=' + jtParams.jtSorting,
                        type: 'Get',
                        dataType: 'json',
                        data: postData,
                        success: function (data) {
                            $dfd.resolve(data);
                            PleaseWaitDialogtask.show(false);
                        },
                        error: function () {
                            $dfd.reject();
                        }
                    });
                });
            },
        },
        fields: {
            ID: {
                key: true,
                list: false
            },
            GroupName: {
                title: 'اسم المجموعة'//,
                //width: '40%'
            },
            GroupDisc: {
                title: 'وصف المجموعة'//,
                //width: '40%'
            },

            Link: {
                title: '',
                display: function (data) {
                    if (data.isRedirect) {
                        window.location.href = data.redirectUrl;
                    }
                }
            },
        }

    });
    $('#GroupsContainer').jtable('load');
    $('.jtable')[0].className = $('.jtable')[0].className + " table table-striped table-bordered table-hover";
});

这是导致错误的行：

 $dfd.resolve(data);

这是我检索记录的操作方法：

[HttpGet]
        public JsonResult GetAllGroups(int jtStartIndex = 0, int jtPageSize = 0, string jtSorting = null, string rangeSt = "", string rangeEd = "")
        {
            try
            {
                LogHelpper.LogMessage("GroupContorller GetAllSystemUsers Post Method Started", EventLogEntryType.Information, log);

                GroupManager groupManager = new GroupManager();
                List<Group> groups = groupManager.SkipAndTake(jtStartIndex, jtPageSize);
                List<GroupCustomViewModel> groupCustomViewModel = groups.Select(group => new GroupCustomViewModel(group)).ToList();

                LogHelpper.LogMessage("GroupContorller GetAllGroups Post Method Ended", EventLogEntryType.Information, log);





                return Json(new { Result = "OK", Records = groupCustomViewModel , TotalRecordCount = groupCustomViewModel .Count }, JsonRequestBehavior.AllowGet);
            }
            catch (Exception ex)
            {
                LogHelpper.LogMessage("Error Message", EventLogEntryType.Error, log);
                LogHelpper.LogException(ex, EventLogEntryType.Error, log);
                return Json(new { Result = "ERROR", Message = ex.Message }, JsonRequestBehavior.AllowGet);
            }
        }

这是我的模型：

public class GroupCustomViewModel
    {
        #region properties
        /// <summary>
        /// Gets or sets the GoupIDPK.
        /// </summary>
        /// <value>The GoupIDPK.</value>
        public int GoupIDPK { get; set; }
        /// <summary>
        /// Gets or sets the GroupName.
        /// </summary>
        /// <value>The GroupName.</value>

        public string GroupName { get; set; }
        /// <summary>
        /// Gets or sets the GroupDisc.
        /// </summary>
        /// <value>The GroupDisc.</value>
        public string GroupDisc { get; set; }

        public string EditHyperlink { get; set; }

        public string DeleteHyperlink { get; set; }

        public string DetalisHyperlink { get; set; }

        public bool DefaultGroup { get; set; }
        #endregion
    }

对不起，如果问题太长，但我不知道错误在哪里，所以我发布了完成任务所需的所有代码。

Answer 1

终于找到问题所在了！！ ...在字段部分的 jTable 定义中 ID 但模型字段名称是 GroupIDPK 因此将 jTable 字段 ID 更改为 GroupIDPK 解决了问题

Uncaught TypeError: Cannot read property 'data' of undefined jquery Jtable

Uncaught TypeError: Cannot read property 'data' of undefined jquery Jtable

javascript

jquery

asp.net-mvc

jquery-ui

jquery-jtable