easyui 过滤ComboGrid-优快云博客

本文介绍如何使用Combogrid组件实现数据记录过滤。通过设置'idField'和'textField'属性，结合本地或远程模式，演示了如何在用户输入字符时发送请求到服务器并返回过滤后的结果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

@author YHC

combogrid 组件和combobox 组件有这个相同的功能函数除了下拉框是基于一个datagrid的,combogrid 组件可以过滤,分页和一些其他的datagrid 的功能.

这个教程向你展示如果过滤数据记录在一个combogrid组件.

创建 ComboGrid

<input id="cg" style="width:150px">

$('#cg').combogrid({  
    panelWidth:500,  
    url: 'form5_getdata.php',  
    idField:'itemid',  
    textField:'productid',  
    mode:'remote',  
    fitColumns:true,  
    columns:[[  
        {field:'itemid',title:'Item ID',width:60},  
        {field:'productid',title:'Product ID',align:'right',width:80},  
        {field:'listprice',title:'List Price',align:'right',width:60},  
        {field:'unitcost',title:'Unit Cost',align:'right',width:60},  
        {field:'attr1',title:'Attribute',width:150},  
        {field:'status',title:'Stauts',align:'center',width:60}  
    ]]  
});

combogrid 组件应该定义'idField' 和'textField'属性.'idField'属性存储着组件值和'textField' 属性显示消息文本在input box.,combogrid 组件可以过滤

它的记录子在 'local' 或者 'remote'模式.在远程(remote)模式combogrid 将发送'q'参数到远程服务器当用户输入字符到input文本框中.

服务器代码

form5_getdata.php

$q = isset($_POST['q']) ? strval($_POST['q']) : '';  
  
include 'conn.php';  
  
$rs = mysql_query("select * from item where itemid like '%$q%' or productid like '%$q%'");  
$rows = array();  
while($row = mysql_fetch_assoc($rs)){  
    $rows[] = $row;  
}  
echo json_encode($rows);