Выпадающий список фильтров выходит за пределы всплывающего окна фильтра в jqxgrid

Я использую виджет jqxgrid, который представляет собой виджет сетки jquery.

Я обнаружил, что раскрывающийся список условий фильтра выходит за пределы всплывающего окна фильтра, и это приводит к тому, что всплывающее окно фильтра автоматически закрывается, если я щелкаю последний элемент в раскрывающемся списке условий фильтра. Поэтому фильтрация при использовании последнего элемента в раскрывающемся списке условий невозможна. Вы можете видеть это на прикрепленном снимке экрана. Из-за этого я не могу фильтровать нулевые или не нулевые условия.

Как я могу предотвратить это?

Проблема с фильтрацией

Код для jqxGrid приведен ниже.

            $("#jqxgrid").jqxGrid({
            theme: 'ui-start',
            width: 740,
            source: dataAdapter,
            pageable: true,
            sortable: true,
            filterable: true,
            autoheight: true,
            virtualmode: true,
            rendergridrows: function (args) {
                return args.data;
            },
            updatefilterconditions: function (type, defaultconditions) {
                var stringcomparisonoperators = ['EMPTY', 'NOT_EMPTY', 'CONTAINS', 
                'DOES_NOT_CONTAIN',  'STARTS_WITH', 
                'ENDS_WITH', 'EQUAL', 'NULL', 'NOT_NULL'];
                var numericcomparisonoperators = ['EQUAL', 'NOT_EQUAL', 'LESS_THAN', 'LESS_THAN_OR_EQUAL', 'GREATER_THAN', 'GREATER_THAN_OR_EQUAL', 'NULL', 'NOT_NULL'];
                var datecomparisonoperators = ['EQUAL', 'NOT_EQUAL', 'LESS_THAN', 'LESS_THAN_OR_EQUAL', 'GREATER_THAN', 'GREATER_THAN_OR_EQUAL', 'NULL', 'NOT_NULL'];
                var booleancomparisonoperators = ['EQUAL', 'NOT_EQUAL'];
                switch (type) {
                    case 'stringfilter':
                        return stringcomparisonoperators;
                    case 'numericfilter':
                        return numericcomparisonoperators;
                    case 'datefilter':
                        return datecomparisonoperators;
                    case 'booleanfilter':
                        return booleancomparisonoperators;
                }
            },

            updatefilterpanel: function (filtertypedropdown1, filtertypedropdown2, filteroperatordropdown, filterinputfield1, filterinputfield2, filterbutton, clearbutton,
           columnfilter, filtertype, filterconditions) {
                var index1 = 0;
                var index2 = 0;
                if (columnfilter != null) {
                    var filter1 = columnfilter.getfilterat(0);
                    var filter2 = columnfilter.getfilterat(1);
                    if (filter1) {
                        index1 = filterconditions.indexOf(filter1.comparisonoperator);
                        var value1 = filter1.filtervalue;
                        filterinputfield1.val(value1);
                    }
                    if (filter2) {
                        index2 = filterconditions.indexOf(filter2.comparisonoperator);
                        var value2 = filter2.filtervalue;
                        filterinputfield2.val(value2);
                    }
                }
                filtertypedropdown1.jqxDropDownList({ autoDropDownHeight: true, selectedIndex: index1 });
                filtertypedropdown2.jqxDropDownList({ autoDropDownHeight: true, selectedIndex: index2 });
            },
            columns: [
                { text: 'Sales Order ID', dataField: 'SalesOrderID', width: 120 },
                { text: 'Sales Order Number', dataField: 'SalesOrderNumber', width: 120 },
                { text: 'Purchase Order Number', dataField: 'PurchaseOrderNumber', width: 120 },
                { text: 'Customer ID', dataField: 'CustomerID', width: 120 },
                { text: 'Order Date', dataField: 'OrderDate', width: 130, cellsformat: 'MM-dd-yyyy' },
                { text: 'Due Date', dataField: 'DueDate', width: 130, cellsformat: 'MM-dd-yyyy' }
            ]
        });

person Sunil    schedule 11.02.2014    source источник


Ответы (1)


Кажется, что подробное изложение вашего вопроса может иногда внезапно дать вам решение и ответ. В моем случае получилось.

В своем коде я установил для параметра autoDropDownHeight значение true, которое на самом деле должно быть установлено на значение false.

Правильный код должен был быть таким, как показано ниже.

 filtertypedropdown1.jqxDropDownList({ autoDropDownHeight: false, selectedIndex: index1 });
 filtertypedropdown2.jqxDropDownList({ autoDropDownHeight: false, selectedIndex: index2 });
person Sunil    schedule 11.02.2014