0

我在 jqx 网格中实现了一个下拉初始化编辑器，它在 Firefox 和 chrome 中运行良好，但在 Internet Explorer 中我面临一个奇怪的问题。当我转到第一页并尝试单击列的任何单元格（我在其中实现了下拉编辑器）时，它会向我显示正确的下拉列表，但是当我尝试单击任何单元格时在第二页上该列的下拉列表为空。我猜这是因为在 Internet Explorer 的第二页上没有调用 init-editor。

我该如何解决？

js小提琴链接

var outputReport = '';
var uidList = [];

$(function() {      

    var listSource =
        {
            datatype: "json",
            dataFields : [ {
                name : "First",
                type : 'string'
            }, {
                name : "Last",
                type : 'string'
            } ],
            id: 'id',
            localdata: [{'id': 1, 'First': 'Abhishek', 'Last': 'Shringi'},{'id': 2, 'First': 'Abhishek', 'Last': 'Shringi'},{'id': 3, 'First': 'Abhishek', 'Last': 'Shringi'},{'id': 4, 'First': 'Abhishek', 'Last': 'Shringi'},{'id': 5, 'First': 'Abhishek', 'Last': 'Shringi'},{'id': 6, 'First': 'Abhishek', 'Last': 'Shringi'}]
        };
        var listAdapter = new $.jqx.dataAdapter(listSource);           

        //Dropdown source for PW Reset 
        var dropDownListSource =
        {
            datatype: "json",
            datafields: [
                { name: 'name' }
            ],
            id: 'id',
            localdata: [{'id': 1, 'name': 'New'},{'id': 2, 'name': 'Yes'},{'id': 3, 'name': 'No'}]
        };
        var dropdownListAdapter = new $.jqx.dataAdapter(dropDownListSource, { autoBind: true, async: false });
        var dropdownListSource = [];
        for (var i = 0; i < dropdownListAdapter.records.length; i++) {
            dropdownListSource[i] = dropdownListAdapter.records[i]['name'];
        }
        // create list user grid
        $('#list-users-table').jqxGrid({
            source : listAdapter,
            altrows:        true,
            autoheight:     true,
            width:          '99%',
            columnsheight: 30,
            editable: true,
            editmode: 'click',
            pagesizeOptions: ['2','4','6','8'],
            pagesize:       2,
            pageable:       true,
            filterable:     true,
            sortable:       true,
            virtualmode:    true,
            selectionmode: 'multiplerowsextended',
            filtermode:     'default',
            rendergridrows: function(params) {                      
                return params.data;
            },
             handlekeyboardnavigation: function(e)
             {                  
                 var key = event.charCode ? event.charCode : event.keyCode ? event.keyCode : 0;                      
                 if (key == 39) {                
                     $("#list-users-table").jqxGrid('gotonextpage');
                 }
                 else if (key == 37) {                       
                     $("#list-users-table").jqxGrid('gotoprevpage');
                 }
                 e.stopPropagation();
                 e.event.cancelbubble = true;                    
             },              
            columnsresize:  true,
            showheader:     true,                   
            columns : [ {
                text : 'PW Reset',
                datafield : 'Reset',
                width : 80,
                columntype: 'dropdownlist',                 
                initeditor: function (row, cellvalue, editor) {                 
                    editor.jqxDropDownList({ source: dropdownListSource});

                    editor.on('select', function(event) {                           
                        var args = event.args;
                        if (args) {
                            var index = args.index;
                            var item = args.item;                                                    
                            var resetType = item.label;
                            var value = item.value;
                            var selection = $("#list-users-table").jqxGrid('getselectedrowindexes');
                            if (selection
                                    && selection.length > 0) {

                                for (var i = 0; i < selection.length; i++) {
                                    var rowData = $('#list-users-table').jqxGrid('getrowdata', selection[i]);


                                }
                            }

                        }

                    });                     
                }                   
            }, {
                text : 'First Name',
                datafield : 'First',
                width : 120,
                editable : false,
                align: 'center'
            }, {
                text : 'Last Name',
                datafield : 'Last',
                width : 120,
                editable : false,
                align: 'center'
            }
            ]           
        });     

        //function calls when apply filter
        $('#list-users-table').on('filter', function (event) {              
            if(event.args.filters.length > 0) {
                $("#export-user-menu-item").show();
            } else {
                $("#export-user-menu-item").hide();
            }
            $('#list-users-table').jqxGrid('updatebounddata', 'filter');
            $("#list-users-table").jqxGrid('clearselection');
        });

        //function calls when apply sorting
        $('#list-users-table').on('sort', function (event) {
            $('#list-users-table').jqxGrid('updatebounddata', 'sort');
            $("#list-users-table").jqxGrid('clearselection');
        });     


});
4

1 回答 1

0

问题在于事件select而不是那个 use close，并且createeditor只绑定一次：

createeditor: function (row, value, editor) {   
  editor.jqxDropDownList({ source: dropdownListSource});

  editor.on('close', function(event) {                          
    var index = editor.jqxDropDownList('getSelectedIndex');
    var item = editor.jqxDropDownList('getSelectedItem');
    var resetType = item.label;
    var value = item.value;
  });
}
于 2015-05-17T05:01:25.300 回答