如何在组合框中进行显示字段的就地更改

时间:2010-01-03 18:55:18

标签: extjs

我有一个ExtJS ComboBox,它链接到id和name的数据。我将valueField设置为id,将displayField设置为name。数据从JsonStore加载。

我想要做的是通过编辑combobox的文本字段部分来更改给定ID的名称。

我通过听取改变事件来解决这个问题。调用change事件时将newValue设置为新的displayField。然后我可以在数据库中更改它并重新加载商店。但是,当我将焦点移离组合框时,会再次使用id调用change事件。我没有可靠的方法来区分文本的更改和选择的更改。

代码如下。非常感谢您的帮助。

 var nameCombo = new Ext.form.ComboBox({
     fieldLabel: 'Name',
     name: 'trailName',
     xtype: 'combo',
     store: nameStore,
     valueField: 'id',
     displayField: 'name',
     typeAhead: true,
     mode: 'local',
     triggerAction: 'all',
     emptyText: 'Select the author for this book...',
     //selectOnFocus:true,
     listeners: {
         scope: book,
         'select': function(combo, record, index) {
             this.authorId = combo.getValue();
             saveBook(this);
         },
         'change': function(field, newValue, oldValue) {
             alert('change: field.value [' + field.getValue() + '], newValue [' + newValue + '], oldValue [' + oldValue + '], segmentId [' + this.id + ']');
             if (oldValue == '') {
                 alert('create trail');
                 var authorDto = {
                     name: newValue,
                     bookId: book.id
                 };
                 Ext.Ajax.request({
                     url: '/RestWAR/personal/book.json',
                     method: 'POST',
                     headers: {
                         'Content-Type': 'application/json'
                     },
                     jsonData: authorDto,
                     scope: this,
                     success: function(response, opts) {
                         var responseObject = Ext.decode(response.responseText);
                         bookStore.reload();
                         this.authorId = responseObject.authorId;
                         // Difficult to access the combobox so let's save directly.
                         saveTrailSegment(this);
                     }
                 });
             } else {
                 alert('change trail');
                 var authorDto = {
                     name: newValue,
                     bookId: book.id
                 };
                 Ext.Ajax.request({
                     url: '/RestWAR/personal/book/' + oldValue + '.json',
                     method: 'PUT',
                     headers: {
                         'Content-Type': 'application/json'
                     },
                     jsonData: authorDto,
                     scope: [field, oldValue],
                     success: function(response, opts) {
                         this[0].store.on('load',
                             this[0].setValue.createDelegate(this[0], [this[1]]), null, {
                                 single: true
                             }
                         );
                         this[0].store.reload();
                     }
                 });
             }
         }
     }
 });

1 个答案:

答案 0 :(得分:0)

我不熟悉控件失去焦点时调用change事件的行为,但是,您应该能够将oldValuenewValue进行比较,以确定用户是否实际更改了任何东西。