EasyUI DataGrid loadFilter

最新推荐文章于 2024-08-15 10:08:02 发布

alwaysOnCoding

最新推荐文章于 2024-08-15 10:08:02 发布

阅读量1.6k

点赞数 2

分类专栏： Jquery 文章标签： EasyUI DataGrid loadFilter

本文链接：https://blog.csdn.net/sinat_36088895/article/details/80642464

版权

Jquery 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

1.UI

<body>

<h1>DataGrid Filter Row</h1>
<div id="tb">
   <span>productid</span><input type="text" id="productid" />
   <span>Status</span><input type="text" id="status"/>
   <span>Attr1</span><input type="text" id="attr1" />
   <span>ItemId</span><input type="text" id="itemid" />
</div>

 <table id="dg" title="DataGrid" style="width:700px;height:250px" data-options="
    singleSelect:true,
    data:data  ">
   <thead>
    <tr>
     <th data-options="field:'itemid',width:80">Item ID</th>
     <th data-options="field:'productid',width:100">Product</th>
     <th data-options="field:'listprice',width:80,align:'right'">List Price</th>
     <th data-options="field:'unitcost',width:80,align:'right'">Unit Cost</th>
     <th data-options="field:'attr1',width:250">Attribute</th>
     <th data-options="field:'status',width:60,align:'center'">Status</th>
    </tr>
   </thead>
  </table>

  <input type="button" valur="筛选" οnclick="filteDatagrid()" />

</body>

2.Js

 <script>

  var data = [{
     "productid": "FI-SW-01",
     "productname": "Koi",
     "unitcost": 10.00,
     "status": "P",
     "listprice": 36.50,
     "attr1": "Large",
     "itemid": "EST-1"
    },
    {
     "productid": "K9-DL-01",
     "productname": "Dalmation",
     "unitcost": 12.00,
     "status": "P",
     "listprice": 18.50,
     "attr1": "Spotted Adult Female",
     "itemid": "EST-10"
    },
    {
     "productid": "RP-SN-01",
     "productname": "Rattlesnake",
     "unitcost": 12.00,
     "status": "P",
     "listprice": 38.50,
     "attr1": "Venomless",
     "itemid": "EST-11"
    },
    {
     "productid": "RP-SN-01",
     "productname": "Rattlesnake",
     "unitcost": 12.00,
     "status": "P",
     "listprice": 26.50,
     "attr1": "Rattleless",
     "itemid": "EST-12"
    },
    {
     "productid": "RP-LI-02",
     "productname": "Iguana",
     "unitcost": 12.00,
     "status": "P",
     "listprice": 35.50,
     "attr1": "Green Adult",
     "itemid": "EST-13"
    },
    {
     "productid": "FL-DSH-01",
     "productname": "Manx",
     "unitcost": 12.00,
     "status": "N",
     "listprice": 158.50,
     "attr1": "Tailless",
     "itemid": "EST-14"
    },
    {
     "productid": "FL-DSH-01",
     "productname": "Manx",
     "unitcost": 12.00,
     "status": "P",
     "listprice": 83.50,
     "attr1": "With tail",
     "itemid": "EST-15"
    },
    {
     "productid": "FL-DLH-02",
     "productname": "Persian",
     "unitcost": 12.00,
     "status": "P",
     "listprice": 23.50,
     "attr1": "Adult Female",
     "itemid": "EST-16"
    },
    {
     "productid": "FL-DLH-02",
     "productname": "Persian",
     "unitcost": 12.00,
     "status": "N",
     "listprice": 89.50,
     "attr1": "Adult Male",
     "itemid": "EST-17"
    },
    {
     "productid": "AV-CB-01",
     "productname": "Amazon Parrot",
     "unitcost": 92.00,
     "status": "N",
     "listprice": 63.50,
     "attr1": "Adult Male",
     "itemid": "EST-18"
    }
   ];

//加载DataGrid
   $(function() {
    $('#dg').datagrid({
     toolbar: '#tb',
})});

//实现筛选功能，只能模糊匹配
  function filteDatagrid() {
    $('#dg').datagrid({
     loadFilter: function(data) {

//获取所有条件录入标签
      var filter = $('#tb>input');
      var filterNameValue = new Array();

//获取所有筛选条件    
      $.each(filter, function(index, item) { 
       var ifilt={ifiltName:'',ifiltValue:''};
       ifilt.ifiltName=item.id.toString().trim();
       ifilt.ifiltValue=item.value.toString().trim();
       filterNameValue[index] = ifilt;
      });
      var count = 0;
      for(var i = 0; i < filterNameValue.length; i++) {
       if("" != filterNameValue[i]['ifiltValue']) {
        count++;
       }
      };

//初始化返回值
      var value = {
       total: data.total,
       rows: []
      };
      var x = 0;

//进行筛选
      for(var i = 0; i < data.length; i++) {
       var rowcount = 0;
       for(var j = 0; j < filterNameValue.length; j++) {
        if("" != filterNameValue[j]['ifiltValue']) {
         if(data[i][filterNameValue[j]['ifiltName']].toString().indexOf(filterNameValue[j]['ifiltValue']) >= 0) {
          rowcount++;
         }
        }
       }
       if(rowcount == count) {

//筛选合格的加入返回值数组中
        value.rows[x++] = data[i];
       }
      }
      return value;
     }
    })
   }
</script>

alwaysOnCoding

关注

2
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录