jQuery网格的过滤器工具栏中未填充下拉列表 [英] dropdown not being populated in filter toolbar in jquery grid

查看:98
本文介绍了jQuery网格的过滤器工具栏中未填充下拉列表的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已将此链接两者都是Oleg解决该问题的方法.我使用了相同的解决方案,但下拉列表中未填充所有"以外的值 我将代码置于加载完成状态,当您调用"setSearchSelect"函数时会看到这些值,但下拉菜单中仅显示全部". 这是代码-

I have referred this link and also this one link Both are Oleg's solutions to the problem. I used the same solution but the drop down doesn't populate with the values except for 'All' I placed the code in load complete and I see the values when you call the 'setSearchSelect' function but only 'All' shows up in the dropdown. Here's the code-

setupGrid: function (grid, pager) {
            $(grid).jqGrid({
                datatype: 'local', // set datatype to local to not inital load data
                mtype: 'GET',
                url: swUrl + ptSearchDashboardUrl,
                colNames: colNames,
                colModel: colModel,
                altRows: false,
                pager: $(pager),
                loadonce: true,
                sortable: true,
                multiselect: true,
                viewrecords: true,
                loadComplete: function (data) {
                        //setSearchSelect.call($grid, 'RequestType');
                    //setSearchSelect.call($grid, 'Country');
                },
                onSelectRow: function() {
                    var checkedIDs = $(this).jqGrid('getGridParam', 'selarrrow');
                    if (checkedIDs.length > 0)
                        $("#ReassignBtn").show();
                    else
                        $("#ReassignBtn").hide();
                }
            }).navGrid(pager, { add: false, edit: false, del: false }).trigger('reloadGrid', [{ current: true }]);

            setSearchSelect.call($grid, 'RequestType');
            setSearchSelect.call($grid, 'Country');
            $grid.jqGrid("setColProp", "Name", {
                searchoptions: {
                    sopt: ["cn"],
                    dataInit: function(elem) {
                        $(elem).autocomplete({
                            source: getUniqueNames.call($(this), "Name"),
                            delay: 0,
                            minLength: 0,
                            select: function(event, ui) {
                                var $myGrid, grid;
                                $(elem).val(ui.item.value);
                                if (typeof elem.id === "string" && elem.id.substr(0, 3) === "gs_") {
                                    $myGrid = $(elem).closest("div.ui-jqgrid-hdiv").next("div.ui-jqgrid-bdiv").find("table.ui-jqgrid-btable").first();
                                    if ($myGrid.length > 0) {
                                        grid = $myGrid[0];
                                        if ($.isFunction(grid.triggerToolbar)) {
                                            grid.triggerToolbar();
                                        }
                                    }
                                } else {
                                    // to refresh the filter
                                    $(elem).trigger("change");
                                }
                            }
                        });
                    }
                }
            });

            $(grid).jqGrid('filterToolbar', {stringResult:true, searchOnEnter:true, defaultSearch:"cn"});
        }

这是从用户界面中获得的-即使有很多,我也只能看到一个选项值.

This is from the UI - I can only see one option value even though there are many.

<td class="ui-search-input">
    <select name="RequestType" id="gs_RequestType" style="width: 100%;">
        <option value="">All</option>
    </select>
</td>

推荐答案

您使用getUniqueNames的代码,该代码使用.jqGrid("getCol", columnName)从列中获取数据.另一方面,您可以使用datatype: 'local'创建空网格.在网格填充数据之前,将在之前进行调用setSearchSelect.call($grid, 'RequestType');setSearchSelect.call($grid, 'Country');getUniqueNames.call($(this), "Name").因此,您将选择元素填充为空集.

The code which you use getUniqueNames which uses .jqGrid("getCol", columnName) to get the data from the column. On the other side you use datatype: 'local' to create empty grid. The calls setSearchSelect.call($grid, 'RequestType');, setSearchSelect.call($grid, 'Country'); and getUniqueNames.call($(this), "Name") will be made before the grid will be filled with data. Thus you fill set empty set of select elements.

我想您稍后将datatype更改为"json""xml"并重新加载网格.只有从服务器获得响应后,您才可以填写选择值.我建议您使用beforeProcessing,它将在从服务器加载数据之后但在处理数据之前调用.您可以修改getUniqueNamessetSearchSelect,使其直接从输入数据中获取数据并调用setColProp.最后,您应该调用destroyFilterToolbar并再次调用filterToolbar以使用当前数据创建过滤器工具栏.

I suppose that you change later the datatype to "json" or "xml" and reload the grid. Only after your get response from the server you will ba able to fill the select values. I would suggest you to use beforeProcessing, which will be called after loading the data from the server, but before processing of the data. You can modify getUniqueNames and setSearchSelect so that it get the data from the input data directly and calls setColProp. Finally you should call destroyFilterToolbar and call filterToolbar once more to create the filter toolbar with the current data.

这篇关于jQuery网格的过滤器工具栏中未填充下拉列表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆