相信用过flexigrid的朋友都知道,它有自带的查询功能,但是我想自定义自己的查询,界面如下:
以下是实现自定义查询的关键代码,希望对大家有所帮助:
html:
<div class="queryForm"> <div style="margin-top:10px;"> <div class="prompt"><span>id:</span></div> <input id="query_id" type="text"/> <div class="prompt"><span>名称:</span></div> <input id="query_name" type="text"/> </div> <div style="margin-top:10px;"> <div class="prompt"><span>描述:</span></div> <input id="query_description" type="text"/> <div class="prompt"><span>父目录:</span></div> <s:select id="query_parent_id" list="#dropMenu.dropMenuList" cssStyle="width:125px;height:20px;" name="query_parent_id" cssClass="default" headerKey="-1" headerValue="请选择" listKey="id" listValue="description"></s:select> </div> </div>
js:
function query(){ var params = [{"name" : "id", "value" : $("#query_id").val()}, {"name" : "name", "value" : $("#query_name").val()}, {"name" : "description", "value" : $("#query_description").val()}, {"name" : "parent_id", "value" : $("#query_parent_id").val()}]; $('#menu_grid').flexOptions({params : params, newp : 1}).flexReload(); }
正如以上代码所示,query方法去调用flexigrid的felxReload方法去刷新,但在刷新之前传入参数,传入参数的格式必须是上面代码中的格式,否则flexigrid将无法解析传入后台,flexReload执行的时候会自动向后台post请求,并且将带上你传入的参数,但这里并没有传入post的url,是因为在初始化flexigrid的时候已经定义好了,flexigrid会自动去找到这个url,并且post向它。还有要注意的是,往往查询的时候是到第一页,所以大家看到flexOptions方法还传入newp,其实newp就是flexigrid向后台传入的最终page参数,所以这里只需指定为1就可以了。希望对大家有所帮助。
个人网站:http://yeshanghai.ueuo.com/
个人google code:http://code.google.com/p/andy-dreamer/,大家可以通过svn下载我最新的代码
相关推荐
NULL 博文链接:https://zhangyinyou.iteye.com/blog/677161
Flexigrid For Asp.Net 多选,客户端排序,自定义
flexigrid的colModel中增加自定义新列
《修改jQuery表格插件flexigrid源码添加自定义功能》文章配套代码http://blog.csdn.net/neareast/article/details/12904393,对jquery表格插件flexigrid的源码进行修改,增加了几个自定义功能,对其功能进行了增强。...
flexigrid.jsflexigrid.jsflexigrid.jsflexigrid.jsflexigrid.jsflexigrid.jsflexigrid.js
Flexigrid demo
jquery flexigrid;jquery flexigrid
flexigrid.js flexigrid.css
FlexiGrid配置与使用说明,不错的文档
FlexiGrid(js版本)
我们都知道flexigrid表格插件的列宽只能设为固定的值,不能使用百分比来自适应窗口的变化。 本例通过修改flexigrid的源代码来实现列宽的自适应变化。如下使用:{display:'XXX',name:'XXX',width:'30%',sortable:...
此项目是struts2+json+flexigrid的完整实例,可帮助你对flexigrid快速上手,项目下载后直接导入自己的工程即可,所用jar包会另传,因为超出上传限制,还请理解。
FlexiGrid使用手册,主要介绍FlexiGrid的主要属性和使用方法。
FlexiGrid使用教程
flexigrid删除实例flexigrid删除实例flexigrid删除实例flexigrid删除实例
Flexigrid它具有的功能包括:可以调整列宽,合并列标题,分页,排序,显示/隐藏表格等。Flexigrid显示的数据能够通过Ajax获取或者从一个普通的表格转换。
Flexigrid与struts2 说明,还有Flexigrid的使用说明和Flexigrid的实例。Flexigrid的包。
对于flexigrid的使用,各个参数的意义应该不用解释,网上资料很多。插件接收的数据格式对于刚接触的人来说是个麻烦,这是一位兄台的整理,不尽完美但会告诉你如何封装格式。
jsp中flexigrid插件在ie下样式问题
Flexigrid-表格,所属jquery