api上的例子是在本地过滤的，无法使用，自己摸索了一下。
javascript代码：
?
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 |
|
部分html代码如下：
<form id="gridParams">
号码筛选：<input id="numberFilter" type="text" name="numberFilter" />
号码区：<select name="numberArea" id="numberArea">
<option value="%">全部</option>
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
<option value="40">40</option>
<option value="50">50</option>
<option value="60">60</option>
</select>
<input id="btnOK" type="button" value="查找" onclick="search()" />
</form><div class="l-clear"></div> <br />
<div id="maingrid"></div>
</body>
编辑器真糟糕，想在代码里着色都不行，直接把html标签显示出来了。-_-!
更新：
发现了一个问题：如果点击表格上的翻页或刷新，还是未过滤的数据。无奈，只能继续摸索了。
解决：修改了ligerGrid.js源码
在ligerGrid.js中搜索loadData方法：
//刷新数据
loadData: function (loadDataParm)
{
var g = this, p = this.options;
g.loading = true;
g.trigger(‘loadData‘);
var clause = null;
var loadServer = true;
if (typeof (loadDataParm) == "function")
{
clause = loadDataParm;
if (g.lastData)
{
g.data = g.lastData;
} else
{
g.data = g.currentData;
if (!g.data) g.data = {};
if (!g.data[p.root]) g.data[p.root] = [];
g.lastData = g.data;
}
loadServer = false;
}
else if (typeof (loadDataParm) == "boolean")
{
loadServer = loadDataParm;
}
else if (typeof (loadDataParm) == "object" && loadDataParm)
{
loadServer = false;
p.dataType = "local";
p.data = loadDataParm;
}
//参数初始化
if (!p.newPage) p.newPage = 1;
if (p.dataAction == "server")
{
if (!p.sortOrder) p.sortOrder = "asc";
}
//--------------------------------------------------------------
//这里是参数，有page和pagesize分页信息，所以在这部分加上我自己的查询信息
//--------------------------------------------------------------
var param = [];
if (p.parms)
{
var parms = $.isFunction(p.parms) ? p.parms() : p.parms;
if (parms.length)
{
$(parms).each(function ()
{
param.push({ name: this.name, value: this.value });
});
}
else if (typeof parms == "object")
{
for (var name in parms)
{
param.push({ name: name, value: parms[name] });
}
}
}
if (p.dataAction == "server")
{
if (p.usePager)
{
param.push({ name: p.pageParmName, value: p.newPage });
param.push({ name: p.pagesizeParmName, value: p.pageSize });//---------------------------------------------------------------
//:START 将页面的查询条件加到param参数中去
var numberFilter = document.getElementById("numberFilter").value;
var numberArea = document.getElementById("numberArea").value;
if(numberFilter != null){
param.push({name:"numberFilter", value:numberFilter});
}
if(numberArea != null){
param.push({name:"numberArea", value:numberArea});
}
//END 到这里结束。
//----------------------------------------------------------------
}
if (p.sortName)
{
param.push({ name: p.sortnameParmName, value: p.sortName });
param.push({ name: p.sortorderParmName, value: p.sortOrder });
}
};
$(".l-bar-btnload span", g.toolbar).addClass("l-disabled");
if (p.dataType == "local")
{
g.filteredData = p.data || g.currentData;
if (clause)
g.filteredData[p.root] = g._searchData(g.filteredData[p.root], clause);
if (p.usePager)
g.currentData = g._getCurrentPageData(g.filteredData);
else
{
g.currentData = g.filteredData;
}
g._convertTreeData();
g._showData();
}
else if (p.dataAction == "local" && !loadServer)
{
if (g.data && g.data[p.root])
{
g.filteredData = g.data;
if (clause)
g.filteredData[p.root] = g._searchData(g.filteredData[p.root], clause);
g.currentData = g._getCurrentPageData(g.filteredData);
g._convertTreeData();
g._showData();
}
}
else
{
g.loadServerData(param, clause);
//g.loadServerData.ligerDefer(g, 10, [param, clause]);
}
g.loading = false;
},
（代码编辑器真心糟糕！一个打不开，一个有时候又不生效。）
这样改虽然可以，但感觉还是不太好。
可以修改一下源码来复用。
例如：加个方法，加个全局数组，将数据加到数组中去，然后将参数加到loadData方法里。
有时间试试！
Liger UI 表格数据查找/通过条件加载数据