如何在jquery DataTable的列渲染功能中显示来自Controller的数据?

时间:2018-11-07 19:19:28

标签: jquery razor model-view-controller datatables

var CityListVM;         $(function(){

        CityListVM = {
            dt: null,

            init: function () {
                dt = $('#Vendor-data-table').DataTable({
                    "serverSide": true,
                    "processing": true,
                    "ajax": {
                        "url": "@Url.Action("GetVendorList", "MgtVendor")",
                        "type": "POST",
                        "data": function (data) {

                            data.CustomerKey = $("#CustomerKey").val();
                            data.CustomerName = $("#CustomerName").val();
                            data.State = $("#State").val();
                            data.City = $("#City").val();
                            data.Attachments = $("#Attachments").val();
                            data.ZIP = $("#ZIP").val();
                            data.Phoneref = $("#Phoneref").val();
                            data.Phone = $("#Phone").val();
                            data.Email = $("#Email").val();
                            data.PrimaryContact = $("#PrimaryContact").val();
                            data.TradeList = $("#TradeList").val();
                        }
                    },
                    "columns": [

                        {
                            "title": "Vendor Name", "searchable": true, "sortable": true,
                            "render": function (data, type, full, meta) {
                                if (full.Attachments) return '<a href="@Url.Action("Details", "MgtVendor")?id=' + full.CustomerKey + '" style="color:blue" target="_blank">' + full.CustomerName + '</a><img src="/Content/attachment-solid.png" height="10" />';
                                else return '<a href="@Url.Action("Details", "MgtVendor")?id=' + full.CustomerKey + '" style="color:blue" target="_blank">' + full.CustomerName + '</a>';
                            }
                        },

                        { "title": "State", "data": "State", "searchable": false, "sortable": false },

                        { "title": "City", "data": "City", "searchable": false, "sortable": false },
                        { "title": "ZIP", "data": "ZIP", "searchable": false, "sortable": false },
                        {
                            "title": "Trades",
                            "searchable": true,
                            "data":"TradeList",
                            "sortable": false,
                            "render": function (data, type, full, meta) {
                                var as = null;
                                return full.TradeList=function () {
                                    var urld = '@Url.Content("~/")' + "Utility/GetVendorTradeList";
                                    $.getJSON(urld, { vendorkey: full.CustomerKey }, function (data1) {
                                        return data1.val();                                            
                                    });
                                };
                            }
                        },
                        { "title": "Contact", "data": "PrimaryContact", "searchable": false, "sortable": false },
                        {
                            "title": "Phone",  "searchable": false, "sortable": true,
                            "render": function (data, type, full, meta) {
                                return '<a class="btn btn-info" href="' + full.Phoneref + '">' + full.Phone +'</a>'; }
                        },

                        {
                            "title": "Control",
                            "data": "CustomerKey",
                            "searchable": false,
                            "sortable": false,
                            "render": function (data) {
                                return '<a href="@Url.Action("EditVendor", "MgtVendor")?id=' + data + '" class="btn">Edit</a> || <a href="@Url.Action("Delete", "MgtVendor")?id=' + data + '" class="btn">Deactivate</a>';
                            }
                        }
                    ],
                    "lengthMenu": [[100, 50, 25, 10], [100, 50, 25, 10]],
                });
            },

            refresh: function () {
                dt.ajax.reload();
            }
        }
        // Advanced Search Modal Search button click handler
        $('#btnPerformAdvancedSearch').on("click", CityListVM.refresh);
        // initialize the datatables
        CityListVM.init();
    });

我真正需要帮助的部分是:

                        {
                            "title": "Trades",
                            "searchable": true,
                            "data":"TradeList",
                            "sortable": false,
                            "render": function (data, type, full, meta) {
                                var as = null;
                                return full.TradeList=function () {
                                    var urld = '@Url.Content("~/")' + "Utility/GetVendorTradeList";
                                    $.getJSON(urld, { vendorkey: full.CustomerKey }, function (data1) {
                                        return data1.val();                                            
                                    });
                                };
                            }
                        },

0 个答案:

没有答案