如何创建具有动态列结构的DataTable?

时间:2018-08-15 17:00:54

标签: javascript c# html model-view-controller datatables

我需要构造一个在MVC项目中没有预定义列的DataTable。列的数量应在数据库字段中的现有数据量之后定义。

我的模型中有一个名为“低层ID”的字段,它是另一个表(“低层”表)中的FK。我需要为数据库中注册的每个低层ID创建列。除此之外,这些列不能以“低层ID”作为标题的标题,它们需要显示“低层名称”作为标题,这是我需要FK获取的字段。

将显示的数据将来自“数量”字段(“基本小时数”表,视图的主表中的字段)。每个列都应能够在列的低层ID中显示相应的数量。

直到现在,我一直试图在下面以这种方式创建列,但是仍然没有放置字段应该显示的数据,甚至没有标题的正确标题。

JAVASCRIPT

var colsBaseLT = [];
function CreateColumnsBH() {
$.ajax({
    url: urlLTList, //refers to the LT List method from the Controller
    dataType: 'json',
    type: 'POST',
    aynsc: false,
    success: function (result) {
        //the result comeback an array of Low Tier Ids
        //The function below iterate an Array and try to create a columns for each element on it 
        var ltLength = result.length;
        for (var i = 0; i < ltLength; i++) {
            colsBaseLT.push({ data: null, orderable: false, className: 'col-sm-2 text-center', title: "titulo", defaultContent: '' });
        }
    }
});


function CreateTableBH() {
$.ajax({
    url: urlCreateTableBH, //refers to the GetBaseHour method from the Controller
    type: 'POST',
    success: function (result) {
        dataTableBH = DataTablesAjaxScrollHeight('#tableBaseHour', colsBaseLT, result.Grid, null, "350px");
    }
}); 

$(document).ready(function () {
    CreateColumnsBH();
    DataTablesAjaxPagination("#tableBaseHour", colsBaseLT, null, null, 12, 'BaseHour');
    CreateTableBH();
}

CONTROLLER(C#)

    public JsonResult GetBaseHour()
    {
        //get the data from the Base Hour table, the main table of the View
        return Json(new { Grid = new BaseHourBusiness().GetList<BaseHour>(Util.AuxiliaryMethods.BMPerRequestInstance)});
    }

    public JsonResult LTList()
    {
        var lowTierList = new LowTierBusiness().GetList<LowTier>(Util.AuxiliaryMethods.BMPerRequestInstance).Select(
                s => new
                {
                    s.Name
                }).ToList();
        //in the Join above I try to get the LowTierNames of the Low Tier table
        return Json(lowTierList);
    }

0 个答案:

没有答案