0

JqueryDataTableとJqueryDataTable.Filterプラグインをダウンロードしました。

これが私が取り組んでいるコードです。

var oTable = $('#myDataTable').dataTable({
        "bServerSide": true,
        "sAjaxSource": "/User/DataProviderAction",
        "bJQueryUI": true
    });

    oTable.columnFilter({ sPlaceHolder: "head:before",
        aoColumns: [{ type: "select", values: ["Box Office", "Concessions"] },
                    { type: "select",values: ["Administrator","Sales People"]},
                    {type: "text"}

                    ]
    });

質問：aoColumnsに値をハードコーディングする代わりに、データベースから値をロードする方法を教えてください。私はMVCを使用しています。役立つ場合は、リポジトリに文字列値を返すように設定されたメソッドがあります。

4

1 に答える 1

2

jquery ajax呼び出しを実行し、データテーブルで使用できる応答値にJavascript変数を設定することで、コントローラーからデータベース値を取得できます。以下に疑似例があります。コントローラはJson応答を返します。これは、モデルである可能性があります。

YourModel model = new YourModel();
model.DBList1 = SomeValue;
model.DBList2 = SomeOtherValue;
return Json(model); // Use return Json(model, JsonRequestBehavior.DenyGet); if you want to limit access to post only.

ajax呼び出しから投稿を行う場合は、コントローラーアクションに[HttpPost]属性を含めることを忘れないでください。

$(document).ready(function () {

var List1;
var List2;

$.ajax({
    type: "POST",
    url: "Controller URL",
    contentType: "application/json; charset=utf-8",
    ...
    ...
    success: function(response) {
    List1 = response.DBList1;
    List2 = response.DBList2;
    }
});


var oTable = $('#myDataTable').dataTable({ 
    "bServerSide": true, 
    "sAjaxSource": "/User/DataProviderAction", 
    "bJQueryUI": true 
    }); 

    oTable.columnFilter({ sPlaceHolder: "head:before", 
    aoColumns: [{ type: "select", values: List1 }, 
                { type: "select",values: List2 }, 
                {type: "text"} 

                ] 
    }); 

});
于 2012-10-11T08:11:20.697 に答える