jQuery EasyUI 表单 - 过滤下拉数据网格
下拉数据网格（Combogrid）组件和下拉框（Combobox）组件的共同点是，除了都具有下拉面板以外，它们都是基于数据网格（Datagrid）的。 下拉数据网格（Combogrid）组件可以过滤、分页，并具有其他一些数据网格（Datagrid）的功能。 本教程向您展示如何在一个下拉数据网格（Combogrid）组件中过滤数据记录。
创建下拉数据网格（Combogrid）
<input id="cg" style="width:150px">
$(&qpos;#cg&qpos;).combogrid({
panelWidth:500,
url: &qpos;form5_getdata.php&qpos;,
idField:&qpos;itemid&qpos;,
textField:&qpos;productid&qpos;,
mode:&qpos;remote&qpos;,
fitColumns:true,
columns:[[
{field:&qpos;itemid&qpos;,title:&qpos;Item ID&qpos;,width:60},
{field:&qpos;productid&qpos;,title:&qpos;Product ID&qpos;,align:&qpos;right&qpos;,width:80},
{field:&qpos;listprice&qpos;,title:&qpos;List Price&qpos;,align:&qpos;right&qpos;,width:60},
{field:&qpos;unitcost&qpos;,title:&qpos;Unit Cost&qpos;,align:&qpos;right&qpos;,width:60},
{field:&qpos;attr1&qpos;,title:&qpos;Attribute&qpos;,width:150},
{field:&qpos;status&qpos;,title:&qpos;Stauts&qpos;,align:&qpos;center&qpos;,width:60}
]]
});
下拉数据网格（Combogrid）组件应该定义 &qpos;idField&qpos; 和 &qpos;textField&qpos; 属性。 &qpos;idField&qpos; 属性存储组件值，&qpos;textField&qpos; 属性在 input 文本框中显示文本消息。 下拉数据网格（Combogrid）组件可以以 &qpos;local&qpos; 或 &qpos;remote&qpos; 模式过滤记录。 在远程（remote）模式中，当用户输入字符到 input 文本框中，下拉数据网格（Combogrid）将发送 &qpos;q&qpos; 参数到远程服务器。
服务器端代码
form5_getdata.php
$q = isset($_POST[&qpos;q&qpos;]) ? strval($_POST[&qpos;q&qpos;]) : &qpos;&qpos;;
include &qpos;conn.php&qpos;;
$rs = mysql_query("select * from item where itemid like &qpos;%$q%&qpos; or productid like &qpos;%$q%&qpos;");
$rows = array();
while($row = mysql_fetch_assoc($rs)){
$rows[] = $row;
}
echo json_encode($rows);
