2017-02-21 13 views
3

Как заполнять значение поля со списком вместо жесткого кодирования из базы данных в магазин со спискомКак загрузить значения в выпадающем списке из базы данных

{ 
    xtype: 'fieldset', 
    title: 'Dress Types', 
    items: [ 
     { 
      xtype: 'combobox', 
      displayField: "displayName", 
      valueField: "displayName", 
      emptyText: 'Select Type', 
      store: { 
       fields: ["id", "displayName"], 
       data: [ 
        { "id": "1", "displayName": "Kurtha" }, 
        { "id": "2", "displayName": "Denim Top" }, 
        { "id": "3", "displayName": "Western T shirt" }, 
        { "id": "4", "displayName": "Sleeveless" } 
       ] 
      }, 
      name: 'dresses', 
      margin: '15px', 
      allowBlank: false, 
      forceSelection: true, 
     } 
    ] 
} 

Заранее спасибо

+0

Создайте 'store' и' model' для своего набора данных и назначьте его в свой список. Прочитайте [docs] (https://docs.sencha.com/extjs/6.0.2/classic/Ext.data.Store.html) – qmateub

+0

@qmat, если я использую, как показано ниже, это не работает, но вы можете исправить меня ?? 'вар магазин = Ext.create ('Ext.ux.data.SqlStore', {' ' StoreID: "dresstore",' ' SQL: "SELECT dresstype ОТ dresstable"' ' });' –

+1

и нижеприведенные решения хороши для вас. Взгляните на них. – qmateub

ответ

2

Проверьте код ниже ,

Ext.create('Ext.form.ComboBox', { 
    valueField: "displayName", 
    emptyText: 'Select Type', 
    store: Ext.create('Ext.data.Store', { 
     fields: ["id", "displayName"], 
     proxy: { 
      url: 'data1.json', 
      reader: { 
       type: 'json', 
       rootProperty: 'data' 
      } 
     }, 
     autoLoad: true 
    }), 
    name: 'dresses', 
    margin: '15px', 
    allowBlank: false, 
    forceSelection: true, 
    renderTo: Ext.getBody() 
}); 

Я предполагал, мое обслуживание returing данных, как показано ниже

{ 
"data": [{ 
    "id": "1", 
    "displayName": "Kurtha" 
}, { 
    "id": "2", 
    "displayName": "Denim Top" 
}, { 
    "id": "3", 
    "displayName": "Western T shirt" 
}, { 
    "id": "4", 
    "displayName": "Sleeveless" 
}] 
} 
3

Есть способы, с помощью которых вы можете получить это. Вам нужно создать одно хранилище в js из ваших входных данных, а затем назначить его в comboBox.

Данный пример

var combstore = Ext.create('Ext.data.Store', { 
      autoLoad: true, 
      fields: [{ 
       name: 'value', 
       mapping: "ITEMID", 
       type: 'string' 
      }, { 
       name: 'name', 
       mapping: "TITLE", 
       type: 'string' 
      }], 
      proxy: new Ext.data.HttpProxy({ 
       type: 'ajax', 
       actionMethods: { 
        read: "POST" 
       }, 
       url: Your URL, 
       headers: { 
        'Accept': 'application/json; charset=utf-8' 
       }, 
       reader: { 
        type: 'json', 
        rootProperty: 'data' 
       }, 
       autoLoad: true 
      }) 
     }); 

Теперь в вашем COMBOBOX вы можете назвать это combstore к вашему store. store :combstore

В переменной combostore мы создаем одно хранилище данных, используя Ext.data.Store и размещая значения в поле. Затем в прокси-методе вызывается url и отображает значения из поля. Прочтите документ для лучшего понимания. Doc