IE9中的ExtJS 5网格过滤和排序中断

ExtJS 5 grid filtering and sorting breaks in IE9

本文关键字:排序 中断 过滤 网格 中的 ExtJS IE9      更新时间:2023-09-26

我试图添加过滤到一个简单的ExtJS 5网格。我使用的是安装提供的一个简单的例子,看起来它工作得很好,除了在IE中,当我试图过滤所有的记录被擦除。

有人看到这个问题吗?这是我正在使用的代码。

' $ (" # SearchEmployees ")。点击(function () {

var criteria = $("#employeeName").val();
if (criteria == '' || criteria == null) {
    alert("Please apply search criteria.");
    return;
}
var baseurl = $("#hdnUrlSearch").val();
var data = (function () {
    $("#employeesSearchGrid").empty();
    $.ajax({
        type: "POST",
        url: baseurl,
        dataType: "json",
        data: { employeeName: criteria },
        async: false
    }).done(function (retData) {
        data = retData;
    }).fail(function (xhr) {
        alert(xhr.responseText);
    });
    return data;
})();
Ext.define('EmployeeSearch', {
    extend: 'Ext.data.Model',
    fields: [
        'FullName',
        'DepartmentName',
        'PhoneNumber',
        'EmailAddr'
    ]
});

var store = Ext.create('Ext.data.Store', {
    model: 'EmployeeSearch',
    proxy: {
        type: 'ajax'          
    },
    data: data
});
var grid = Ext.create('Ext.grid.Panel', {
    store: store,
    forceFit: true,
    columns: [{
        header: 'Name',
        dataIndex: 'FullName',
        flex: 1,
        filter: 'string',
        width: 440
    }, {
        header: 'Department',
        dataIndex: 'DepartmentName',
        filter: 'string',
        flex: 1,
        width: 200
    }, {
        header: 'Direct Phone',
        dataIndex: 'PhoneNumber',
        filter: 'string',
        flex: 1,
        width: 240
    }, {
        header: 'Notification Email',
        dataIndex: 'EmailAddr',
        flex: 1,
        filter: 'string'
    }],
    renderTo: 'employeesSearchGrid',
    frame: true,
    plugins: ['gridfilters']
});

}); '

通过添加网格的高度修复了这个问题。这样一来,过滤和排序就固定了。这是我的网格现在的样子:

 var grid = Ext.create('Ext.grid.Panel', {
    store: store,       
    columns: [{
        text: 'Name',
        dataIndex: 'FullName',            
        flex: 1,
        width: 440,
        sortable: true,
        filter: 'string'
    }, {
        text: 'Department',
        dataIndex: 'DepartmentName',
        flex: 1,
        width: 200,
        sortable: true,
        filter: 'string'
    }, {
        text: 'Direct Phone',
        dataIndex: 'PhoneNumber',
        flex: 1,
        width: 240,
        sortable: true,
        filter: 'string'
    }, {
        text: 'Notification Email',
        dataIndex: 'EmailAddr',
        flex: 1,
        sortable: true,
        filter: 'string'
    }],
    forceFit: true,
    split: true,
    renderTo: 'employeesSearchGrid',
    height: 210,
    frame: true,
    plugins: ['gridfilters']
});