搜索框如下:
js代碼(搜索按鈕的點擊事件部分):
$("#standardQueryBtn").click(function(){//點擊搜索按鈕的觸發(fā)事件 if($("#offerid").val() != ""){//判斷id搜索框的值是否為空 $("#dg").datagrid('load',{//調(diào)用load方法傳遞參數(shù),從服務(wù)器加載新數(shù)據(jù) "offer.id":$("#offerid").val(),//將搜索框的值賦給offer.id并傳到后端 "flag":'qid',//傳遞一個flag值用于判斷執(zhí)行何種操作 }); }else if($("#offername").val() != ""){//判斷name搜素框的值是否為空 $.post("${pageContext.request.contextPath}/OfferServlet",//通過ajax的post函數(shù)傳遞flag和offername值 {flag:"qname","offer.name":$("#offername").val()}, function(ons){//回調(diào)函數(shù)處理 var json = JSON.parse(ons);//將返回的字符串轉(zhuǎn)換為JSON $('#dg').datagrid('loadData',json);//將表格數(shù)據(jù)初始化方式更新 }); } });jsp代碼(只包含按鈕和搜索框的toolbar):
<div id="toolbar"> <a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newOffer()">新增商品</a> <a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editOffer()">編輯商品</a> <a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyOffer()">刪除商品</a><br> 商品ID:<input type="text" name="offer.id" id="offerid" /> 商品名稱:<input type="text" id="offername"/> <a id="standardQueryBtn" href="javascript:void(0)" rel="external nofollow" class="easyui-linkbutton" data-options="iconCls:'icon-search'">搜索</a> </div>
總結(jié)
以上所述是小編給大家介紹的使用Easyui實現(xiàn)查詢條件的后端傳遞并自動刷新表格的兩種方法,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對武林網(wǎng)網(wǎng)站的支持!
如果你覺得本文對你有幫助,歡迎轉(zhuǎn)載,煩請注明出處,謝謝!
新聞熱點
疑難解答