Отображение полей формы зависит от значения в выпадающем списке ExtJs - PullRequest
0 голосов
/ 28 сентября 2018

У меня есть выпадающий список со значениями '1,2,3,4,5 .... 13'

Если выбрано значение 1, тогда я должен отобразить 3 поля для существующих полей формы,Если значение 2,3,4,5 или 6, то мне нужно добавить одно поле.

{
    xtype:'combobox',
    name:'user_role',
    id : 'user_role',
    fieldLabel: 'Role',
    displayField: 'role_name',
    valueField: 'role_id',
    store: roleStore,
    allowBlank: false,                  
    queryMode : 'local'
},

код для отображения / скрытия полей:

created hideden fields like :

{
    xtype: 'textfield',
    fieldLabel: 'License Number',
    name: 'doctor_licenseNumber', 
    id : 'doctor_licenseNumber',
    //allowBlank: false,
    enablekeyEvents: true,  
    hidden: true,               
},  

Ext.getCmp('user_role').on('change', this.onChange, this);

onChange: function(field, newValue) {
    switch(newValue) {
        case '1':
            Ext.getCmp('doctor_type').show();
            Ext.getCmp('doctor_licenseNumber').show();              
            Ext.getCmp('doctor_departmentId').show(); 
            Ext.getCmp('marketing_allocationStatus').hide(); 
            break;
        case '2':
            Ext.getCmp('marketing_allocationStatus').show();
            Ext.getCmp('doctor_type').hide();
            Ext.getCmp('doctor_licenseNumber').hide();              
            Ext.getCmp('doctor_departmentId').hide(); 
            break;
        default :
            Ext.getCmp('doctor_type').hide();
            Ext.getCmp('doctor_licenseNumber').hide();              
            Ext.getCmp('doctor_departmentId').hide(); 
            Ext.getCmp('marketing_allocationStatus').hide();
    }
},

Работает, но мне также нужно проверить значения «3,4 и 5».Я думаю, что есть правильный способ сделать это.«2,3,4 и 5» имеют общее значение для «родительского идентификатора».

Пожалуйста, поделитесь своими идеями ..

1 Ответ

0 голосов
/ 28 сентября 2018

Предполагая, что вы ожидаете обработки общих случаев, вы можете связать несколько случаев с одной и той же логикой следующим образом:
Если case1 и case2 должны выполнять одну и ту же функцию, вы можете использовать ее следующим образом:

case1:
case2:
   //your code

В соответствии с описанием, которое вы предоставили, похоже, что вы должны выполнить те же функции для случаев 2,3,4,5,6.Учитывая это, я изменил ваш код следующим образом:

{
    xtype: 'textfield',
    fieldLabel: 'License Number',
    name: 'doctor_licenseNumber', 
    id : 'doctor_licenseNumber',
    //allowBlank: false,
    enablekeyEvents: true,  
    hidden: true,               
},  

Ext.getCmp('user_role').on('change', this.onChange, this);

onChange: function(field, newValue) {
    switch(newValue) {
        case '1':
            Ext.getCmp('doctor_type').show();
            Ext.getCmp('doctor_licenseNumber').show();              
            Ext.getCmp('doctor_departmentId').show(); 
            Ext.getCmp('marketing_allocationStatus').hide(); 
            break;
        case '2':
        case '3':
        case '4':
        case '5':
        case '6':
            Ext.getCmp('marketing_allocationStatus').show();
            Ext.getCmp('doctor_type').hide();
            Ext.getCmp('doctor_licenseNumber').hide();              
            Ext.getCmp('doctor_departmentId').hide(); 
            break;
        default :
            Ext.getCmp('doctor_type').hide();
            Ext.getCmp('doctor_licenseNumber').hide();              
            Ext.getCmp('doctor_departmentId').hide(); 
            Ext.getCmp('marketing_allocationStatus').hide();
    }
},
...