修改flexigrid 能用form查询

很久没写Blog了,这次写写项目中用到的flexigrid,在里面能够写查询表单 方便增加查询条件
打开jquery.flexigrid.js文件,其中:在populate: function()方法里面加多个ajax的方法:

var param = $("#searchForm").serialize(); //重点,将form表单序列化成url参数字符串
$.ajax({
type: p.method,
/* ***** 原来的代码注释掉
url: p.url,
data: param,
原来的代码注释掉 **** */
url: p.url+u,
data: param,
dataType: p.dataType,
success: function(data) { if (data != null && data.error != null) { if (p.onError) { p.onError(data); g.hideLoading(); } } else { g.addData(data); } },
error: function(data) { try { if (p.onError) { p.onError(data); } else { alert("获取数据发生异常;") } g.hideLoading(); } catch (e) { } }

然后在使用flexigrid的页面加上你的查询表单:
<body>
<div id="ptable" style="margin: 10px;"></div>
<form name="searchForm" id="searchForm" method="post">
<table id="pjTable" style="display: none;"></table>
<table id="searchTab" class="searchTab">
<tr>
<td>
服务点名称:<input type="text" id="serviceName" name="serviceName" maxlength="10" size="15" />
  
城市名称:<select name="cityId" id="cityId" class="drpdwn">
</select>
  
<input type="button" value=" 查询 " οnclick="search()" id="searchBtn" title="条件为空,则查询所有." />
<input type="reset" value=" 清空 " οnclick="clearValue()" id="clearBtn" />
</td>
</tr>
</table>
</form>

<!-- 编辑部门信息 -->
<div class="jqmWindow" id="editServicePointForm" width="30%" ALIGN="CENTER">
<form name="servicePointForm" id="servicePointForm"
action="<%=contextPath%>/pujin/ServicePoint/ServicePointAction.do?method=addServicePointAction"
method="post">
<input type="hidden" name="id" id="id" />
<input type="hidden" name="cityId" id="cityId" />
<table border="1" ALIGN="CENTER" width="50%">
<tr>
<td>
服务网点名称
</td>
<td>
<input type="text" id="serviceName" name="serviceName" class="tex0"/>
</td>
</tr>
<tr>
<td>
所属城市
</td>
<td>
<input type="text" id="city" name="city" class="tex0"/>
<input type="button" value="选择" class="sbttn" οnclick="updateCity()">
</td>
</tr>
<tr>
<td colspan="2">
<input type="button" value=" 保存 " οnclick="modify()" />
  
<input type="button" value=" 取消 " class="jqmClose" />
</td>
</tr>
</table>
</form>
</div>
</body>
});

最后 添加一下javascript 使modify()这个方法能查询
function modify(){
var param = $("#servicePointForm").serialize();
$.ajax({
type:"POST",
data: param,
url:"<%=contextPath%>/pujin/ServicePoint/ServicePointAction.do?method=addServicePointAction",
success:function(result){
$("#servicePointForm input[type!=button]").each(function(){
this.value = "";
});
alert(result);
$("#editServicePointForm").jqmHide();
$("#pjTable").flexReload();
}
});
}
这样就能解决原来flexigrid没有查询条件的问题
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值