从下到上自定义flexigrid搜索框

时间:2013-11-16 06:58:25

标签: jquery flexigrid

我在 codeigniter 框架项目中使用 flexigrid 。一切正常。 现在我有一个要求 - 我需要在网格顶部显示“搜索框”,而不是底部。

我找不到更好的选择。所以请帮助我。

1 个答案:

答案 0 :(得分:0)

不幸的是,似乎没有任何选项可以设置为执行此操作。唯一的方法是编辑flexigrid.js文件。

您要编辑的地方位于第1313行:

//add search button
if (p.searchitems) {
    $('.pDiv2', g.pDiv).prepend("<div class='pGroup'> <div class='pSearch pButton'><span></span></div> </div>  <div class='btnseparator'></div>");
    $('.pSearch', g.pDiv).click(function () {
            $(g.sDiv).slideToggle('fast', function () {
                    $('.sDiv:visible input:first', g.gDiv).trigger('focus');
            });
    });
    //add search box
    g.sDiv.className = 'sDiv';
    var sitems = p.searchitems;
    var sopt = '', sel = '';
    for (var s = 0; s < sitems.length; s++) {
            if (p.qtype === '' && sitems[s].isdefault === true) {
                    p.qtype = sitems[s].name;
                    sel = 'selected="selected"';
            } else {
                    sel = '';
            }
            sopt += "<option value='" + sitems[s].name + "' " + sel + " >" + sitems[s].display + "&nbsp;&nbsp;</option>";
    }
    if (p.qtype === '') {
            p.qtype = sitems[0].name;
    }
    $(g.sDiv).append("<div class='sDiv2'>" + p.findtext +
                    " <input type='text' value='" + p.query +"' size='30' name='q' class='qsbox' /> "+
                    " <select name='qtype'>" + sopt + "</select></div>");
    //Split into separate selectors because of bug in jQuery 1.3.2
    $('input[name=q]', g.sDiv).keydown(function (e) {
            if (e.keyCode == 13) {
                    g.doSearch();
            }
    });
    $('select[name=qtype]', g.sDiv).keydown(function (e) {
            if (e.keyCode == 13) {
                    g.doSearch();
            }
    });
    $('input[value=Clear]', g.sDiv).click(function () {
            $('input[name=q]', g.sDiv).val('');
            p.query = '';
            g.doSearch();
    });
    $(g.bDiv).after(g.sDiv);
}

我想说改变第三行prepend()可能会有所作为,但你必须测试它。

尝试将其更改为:

$('.tDiv2', g.pDiv).prepend()

Hopefull给你一个想法。