Вычислить поле в реальном времени ExtJS

Question

У меня есть поле даты окончания и поле даты истечения срока действия в моей форме ExtJS. Когда пользователь выбирает дату завершения, я хочу, чтобы дата истечения была автоматически заполнена после того, как была выбрана дата завершения.

Вот то, что я до сих пор:

 var completionDate = { 
       fieldLabel: 'Completion Date', 
       xtype: 'datefield', 
       submitFormat: 'time', 
       name: 'trainingCompletion', 
       labelAlign: 'right', 
       labelWidth: 150, 
       readOnly: false, 
       readOnlyCls: 'readOnlyFields', 
       listeners: { 
        select: function (dateField, newValue, oldValue){ 
         expirationDate.oldValue = newValue; 
        } 
       }, 

     }; 
     var expirationDate = { 
       fieldLabel: 'Expiration Date', 
       xtype: 'datefield', 
       submitFormat: 'time', 
       name: 'trainingExpiration', 
       labelAlign: 'right', 
       labelWidth: 150, 
       readOnly: true, 
       readOnlyCls: 'iamis_readOnlyFields' 
     }; 

Функция должна затем добавить 15 месяцев к completionDate, но я хочу, чтобы получить его, чтобы обновить первый

Код для объявления trainingCompletion и trainingExpiration

{name: 'trainingCompletion', type: 'date', dateReadFormat: 'time', dateWriteFormat: 'm/d/Y', useNull: true}, 
{name: 'trainingExpiration', type: 'date', dateReadFormat: 'time', dateWriteFormat: 'm/d/Y', useNull: true}, 

Answer 1

Предоставленный код выглядит очень неполны.

При объявлении слушателей вы должны обратить внимание на область, в которой будет выполняться прослушиватель. Предполагая, что эти 2 поля даты имеют форму, вы должны определить область слушателя, чтобы гарантировать правильную ссылку на поле истечения срока действия.

Я делаю что-то похожее на вас в своем коде, поэтому я поделюсь кодом, который делает это в моем стиле программирования, но вы можете адаптировать его к вашему стилю кодирования.

Ext.define("My.form.Task", { 
    extend: "Ext.form.Panel", 
    alias: "widget.mytaskform", 
    buttonAlign: "left", 
    defaults: { 
     anchor: '100%', 
     margin: '10px 0px 0px 0px', 
     labelAlign: 'left', 
     labelWidth: 125 
    }, 
    initComponent: function() { 
     this.items = [{ 
       fieldLabel: 'Completion Date', 
       xtype: 'datefield', 
       submitFormat: 'time', 
       name: 'trainingCompletion', 
       labelAlign: 'right', 
       labelWidth: 150, 
       readOnly: false, 
       readOnlyCls: 'readOnlyFields', 
       listeners: { 
        select: { 
         scope: this, 
         fn: function (dateField, newValue, oldValue){ 
          var expirationField = this.down("[name=trainingExpiration]"); 
          // You need to add the desired months to the date 
          // before setting it to the expirationField. 
          expirationField.setValue(newValue); 
         } 
        } 
       }, 

     },{ 
       fieldLabel: 'Expiration Date', 
       xtype: 'datefield', 
       submitFormat: 'time', 
       name: 'trainingExpiration', 
       labelAlign: 'right', 
       labelWidth: 150, 
       readOnly: true, 
       readOnlyCls: 'iamis_readOnlyFields' 
     }]; 
     this.callParent(arguments); 
    }, 
    // form remaining code... 
}); 

Answer 2

Это выглядит неправильно:

expirationDate.oldValue = newValue 

Вместо этого вы должны использовать метод надлежащего SetValue() на DateField

expirationDate.setValue(newValue);