Jquery自定义搜索插件
根据已经写好的布局 给出一个端json值然后生成页面的查询部门
例如:
$("#MySearch").jsearch({ data: [ {Name: "标题", Id: "txt_Title", Type: "text" }, { Name: "状态", Id: "txt_State", Type: "Select", Value: [{ Value: 0, Text: "全部" }, { Value: 1, Text: "正常" }, { Value: 2, Text: "停用"}] }, { Name: "标题1", Id: "txt_Title2", Type: "text" }, { Name: "日期", Id: "txt_Time", Type: "text" }, { Name: "状态2", Id: "txt_State1", Type: "Select", Value: [{ Value: 0, Text: "全部" }, { Value: 1, Text: "正常" }, { Value: 2, Text: "停用"}] }, ] });
那么生成的结果如图所示:
前端页面和js:
View Code
<div id="MySearch"> </div> <script type="text/javascript"> $(function () { $("#MySearch").jsearch({ data: [ {Name: "标题", Id: "txt_Title", Type: "text" }, { Name: "状态", Id: "txt_State", Type: "Select", Value: [{ Value: 0, Text: "全部" }, { Value: 1, Text: "正常" }, { Value: 2, Text: "停用"}] }, { Name: "标题1", Id: "txt_Title2", Type: "text" }, { Name: "日期", Id: "txt_Time", Type: "text" }, { Name: "状态2", Id: "txt_State1", Type: "Select", Value: [{ Value: 0, Text: "全部" }, { Value: 1, Text: "正常" }, { Value: 2, Text: "停用"}] }, ] }); }); </script>
然后引用jquery.ui.plugins.jsearch.js就可以了(jquery.ui.plugins.jsearch.js自己封装的)