extjs - Ext JS 4.2 具有远程存储和分页默认值问题的组合框

Question

我的表单上有一个组合框，我用它来添加和编辑我的一个模型。组合框绑定(bind)的值列表可能非常大(1,000 条记录)，因此我需要使用带有分页的远程数据存储来防止必须立即加载所有值。在添加表单中，这效果很好，但是当我尝试使用表单编辑模型时，我无法可靠地将值设置为组合框。

加载组合框时，商店会加载前 50 条记录。问题是，组合框 setValue 函数在设置值之前仅搜索存储中加载的值以查找记录。如果所选记录不在商店的前 50 条记录中，则 setValue 找不到它，并且不会设置该值。

我创建了一个 jsFiddle 来演示该问题:http://jsfiddle.net/mgolus/Z3Jpy/

代码如下:

var testVendorId;
testVendorId = 30; // Works
//testVendorId = 60; // Doesn't Work :-(

Ext.onReady(function() {
    var addUserForm = Ext.create('Ext.form.Panel', {
    renderTo: Ext.getBody(),
    model: 'Test.model.CatalogItem',
    items: [
            {
                xtype: 'textfield',
                name: 'number',
                fieldLabel: 'Number'
            },
            {
                xtype: 'combobox',
                name: 'vendorId',
                fieldLabel: 'Vendor',
                forceSelection: true,
                store: {
                    model: 'Test.model.Vendor',
                    autoLoad: true,
                    pageSize: 50
                },
                displayField: 'name',
                valueField: 'id',
                pageSize: 50 // I know this just needs to be any value > 0 to show the pager, just putting 50 for consistency
            }
        ],
    });

    addUserForm.down('combobox').getStore().on('load', function() {
            var user = Ext.create('Test.model.CatalogItem', { id: 1, number: 'T001', vendorId: testVendorId });
            console.log(user);
            addUserForm.loadRecord(user);    
    });


});

Ext.define('Test.model.CatalogItem', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'id' },
        { name: 'number' },
        { name: 'vendorId' }
    ] 
});

Ext.define('Test.model.Vendor', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'id' },
        { name: 'name' }
    ],
    proxy: {
        type: 'jsonp',
        url: 'http://pmvitals.com/vendors.aspx',
        reader: {
            root: 'data'
        }
    }
});

当选定的 id(在顶部设置的 testVendorId)为 30 时，组合框将填充默认值。如果您将 id 设置为超过 50 的值，则不会填充该值，因为它不存在于商店的首页中。

非常感谢任何帮助!

Answer 1

我遇到了类似的问题。为了克服这个问题，我创建了组合框的自定义扩展(我将其称为 RemoteComboBox)。它的主要功能之一是，如果它的值是通过表单记录加载设置的，甚至只是 setValue()，则默认加载行为是对实际值进行远程请求。这将返回 1 值，因此响应很小，一旦用户再次开始与其交互，组合框的默认行为就会接管。

我的解决方案和您的需求的区别在于您仍然会遇到分页问题。即使您的值最初是通过基于 id 的请求找到的，您仍然面临在多页记录中查找同一项目的挑战。

但是你真的需要分页吗？我发现简单地提供更丰富的搜索工具通常比强制用户筛选几页记录更有帮助。