22EasyUI 数据网格- 添加查询功能

下面演示如何从数据库得到数据，并将它们显示在数据网格（datagrid）中。然后再演示如何根据用户输入的搜索关键词搜寻显示结果。

创建数据网格（DataGrid）

创建带有分页功能的数据网格（datagrid），然后添加工具栏到其中。

        
            
                Item ID
                Product ID
                List Price
                Unit Cost
                Attribute
                Stauts
            
        
    

工具栏定义

 

        Item ID:
        
        Product ID:
        
        Search
    

当用户输入查询值并按下查询按钮时，‘doSearch’ 函数将被调用：

 function doSearch(){
        $('#tt').datagrid('load',{
            itemid: $('#itemid').val(),
            productid: $('#productid').val()
        });
    }

上面的代码调用了 ‘load’ 方法来加载新的数据网格（datagrid）数据。我们需要传递 ‘itemid’ 和 ‘productid’ 参数到服务器。