• flexigrid自定义查询


    相信用过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="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就可以了。希望对大家有所帮助。

    个人google code:http://code.google.com/p/andy-dreamer/,大家可以通过svn下载我最新的代码

    (在不断的尝试中总结经验,以帮助后面的人更快的上路,http://zhs.guohe.in/)

  • 相关阅读:
    Java-----Excel转HTML
    UI_拖动View
    查找——图文翔解Treap(树堆)
    android 三级菜单 BaseExpandableListAdapter
    New Relic——手机应用app开发达人的福利立即就到啦!
    安卓 下载多线程带进度条
    大数据
    Android学习路线(六)为Android应用加入ActionBar
    JavaScript日期对象使用总结
    经典二叉树
  • 原文地址:https://www.cnblogs.com/yeshanghai/p/flexigrid_flexReload.html
Copyright © 2020-2023  润新知