layUI rableは、データの読み込み、データの更新、パラメータの転送を初期化する.
13398 ワード
背景:
筆者は以前からbootstrap tableを使っていましたが、現在のプロジェクトでは主にLayuiのフレームを使っていますので、Layui tableに従って、使う時に問題がありました.もちろん自分の知らない鍋のせいです.
発生した問題:
1、Layui公式から提供された「スタティック・フォームの変換」方式を使って、タイムズidが見つけられないエラーを初期化する(自分の鍋).
2、パラメータ問題(とりあえずLayuiオフィシャル鍋)
最初にソーステーブルのコードを貼り付けます.
筆者は以前からbootstrap tableを使っていましたが、現在のプロジェクトでは主にLayuiのフレームを使っていますので、Layui tableに従って、使う時に問題がありました.もちろん自分の知らない鍋のせいです.
発生した問題:
1、Layui公式から提供された「スタティック・フォームの変換」方式を使って、タイムズidが見つけられないエラーを初期化する(自分の鍋).
2、パラメータ問題(とりあえずLayuiオフィシャル鍋)
最初にソーステーブルのコードを貼り付けます.
<table class="layui-table" lay-filter="EditListTable">
<thead>
<tr>
<th lay-data="{field:'Index', width:60}"> th>
<th lay-data="{field:'UserId', width:80}"> IDth>
<th lay-data="{field:'UserName', width:80}"> th>
<th lay-data="{field:'Year', width:70}"> th>
<th lay-data="{field:'M01', width:80}"> th>
<th lay-data="{field:'M02', width:80}"> th>
<th lay-data="{field:'YearValue', width:80, fixed: 'right'}"> th>
<th lay-data="{width:100, align:'center', toolbar: '#barDemo1', fixed: 'right'}"> th>
tr>
thead>
table>
<script type="text/html" id="barDemo1">
<a class="layui-btn layui-btn-mini" lay-event="edit"> a>
script>
直接コードにコメントを通して説明します.(function () {
// url
var getListUrl = '';
// table, , , , :
// , , js Layui
// Layui table
// Layui table, table , js , table , js
var tableOptions = {
url: getListUrl, //
method: 'POST', //
id: 'listReload', // Layui table id, , ,
page: false, //
where: { type: "all" }, // , , , where: { key : { type: "all" } }, , ,key , type , key Layui ,
response: { // json ,
statusName: 'Code', //
statusCode: '200', //
msgName: 'Message', //
countName: 'Total', //
dataName: 'Result' //
}
};
//
layui.use(['table', 'layer'], function () {//layui ,
var layer = layui.layer, table = layui.table;
//
var createTable = function () {
table.init('EditListTable', tableOptions);// table lay-filter
};
//
var reloadTable = function (item) {
table.reload("listReload", { // id
where: {
//key: { //
type: item.type, id: item.id
//}
}
});
};
//
createTable();
// tree , tree
});
})();
バックエンドの方法:// ,
public ActionResult GetGoalList(string type, string id)
{
//
}
// ,
public ActionResult GetGoalList(keyItem key)
{
//
}
public class keyItem
{
public string id { get; set; }
public string type { get; set; }
}
例が短いので、参考にしたいだけです.何か分からないところがあれば、公式文書を参考にしてください.http://www.cnblogs.com/herbertchina/p/7503927.html!