<div id="testa" style="position: relative;top:10%;"> <!-- 这里的padding-top是让搜索栏向下点,也就是与"添加"等按钮对齐,但在HTML里面不好用,在jsp页面中已测试可用 --> <input id="sss" class="easyui-searchbox" searcher="qq" prompt="请输入查询内容" style="width:200px"></input> <div id="mm" style="width:100px"> </div> </div>
//循环列名,生成搜索的下拉列表 var fields = $('#tt').datagrid('getColumnFields'); var muit=""; for(var i=0; i<fields.length; i++){ var opts = $('#tt').datagrid('getColumnOption', fields[i]); muit += "<div name='"+ fields[i] +"'>"+ opts.title +"</div>"; }; $('#mm').html($('#mm').html()+muit); $('#sss').searchbox({ menu:'#mm' }); //获取生成的搜索框 var a=$("#testa"); //将生成好的搜索框放入工具栏 $(".datagrid-toolbar").append(a);
增加方法:
function qq(value,name){ $('#dg').datagrid('load', { "searchKey": name, "searchValue": value }); }