コンボボックスにJSONファイルのExtJs 4.x.xを入力します。

Question

Ext.define('Form', { 
    extend: 'Ext.data.Model', 
    fields: [ 
     {name:'type', type:'String'} 
    ] 
}); 

var store = Ext.create('Ext.data.ArrayStore', { 
    model: 'Form', 
    autoLoad: true, 
    proxy: { 

     type: 'ajax', 
     url: '/test.json', 
     reader: { 
      type : 'json', 
      root: 'types' 
     } 
    } 
}); 

Ext.define('DForms', { 
    extend: 'Ext.panel.Panel', 
    bodyPadding: 12, 
    layout : 'auto', 
    autoScroll : true, 

     items: [{ 
      xtype:'selectcombo', 
      queryMode:'local', 
      emptyText: 'Select Condition', 
      store:store, 
      displayField: 'type', 
      valueField: 'type', 
      width : 200, 
      typeAhead : true 
     }], 
}); 

これがロードされると、selectcomboは空になります。何もロードされず、多くのサイトを検索して何か助けになることはありません。あなたが探しxtypeがcomboある

Answer 1

ご想像のとおりArrayStoreがtypesルートからjsonを解釈しませんので、任意の提案は素晴らしいことだ、storeタイプがJsonStoreです。私はここでajaxリクエストをシミュレートすることはできません。

Ext.onReady(function() { 
 

 
    Ext.define('Form', { 
 
    extend: 'Ext.data.Model', 
 
    fields: [{ 
 
     name: 'type', 
 
     type: 'String' 
 
    }] 
 
    }); 
 

 
    var store = Ext.create('Ext.data.Store', { 
 
    model: 'Form', 
 
    data: [{ 
 
     type: 'Aaaaaaa' 
 
    }, { 
 
     type: 'Bbbbbb' 
 
    }, { 
 
     type: 'Ccccccccccc' 
 
    }, { 
 
     type: 'Ddddddd' 
 
    }] 
 

 
    }); 
 

 
    Ext.define('DForms', { 
 
    extend: 'Ext.panel.Panel', 
 
    bodyPadding: 12, 
 
    layout: 'auto', 
 
    autoScroll: true, 
 
    items: [{ 
 
     xtype: 'combo', 
 
     queryMode: 'local', 
 
     emptyText: 'Select Condition', 
 
     store: store, 
 
     displayField: 'type', 
 
     valueField: 'type', 
 
     width: 200, 
 
     typeAhead: true 
 
    }], 
 
    }); 
 

 
    Ext.create('DForms', { 
 
    renderTo: Ext.getBody() 
 
    }); 
 

 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/extjs/4.2.1/ext-all-debug.js"></script> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/extjs/4.2.1/resources/css/ext-all.css" />

Answer 2

私は、フィールドでのタイプでは、大文字と小文字が区別だと思います。したがって試してみてください

fields :[{name : 'type', type : 'string'}] 

まだ動作しない場合、Tejas1991があなたのjsonの内容を確認すると指摘しました。