Yerel diziden ExtJs Combobox

Yerel dizi listesini kullanarak bir Ext Js birleşik giriş kutusu yerleştirmeye çalışıyorum. Ext Js örneklerinde, açılan farklı bir status.js dosyasından doldurulur.Yerel diziden ExtJs Combobox

Örneğimde veriler yerel değişkenden gelmelidir. Çalışmıyor.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<title>Combo Boxes</title> 
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" /> 
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script> 
<script type="text/javascript" src="../../ext-all.js"> 
</head> 

<body> 
<script type="text/javascript"> 
var exampleData2 = [['1', 'hello'],['2', 'hi'],['3', 'bye']]; 
Ext.onReady(function(){ 
Ext.QuickTips.init(); 

// simple array store 
var store = new Ext.data.ArrayStore({ 
    fields: ['abbr', 'state'], 
    data : exampleData2 
}); 
    var combo = new Ext.form.ComboBox({ 
    store: store, 
    displayField:'state', 
    typeAhead: true, 
    mode: 'local', 
    forceSelection: true, 
    triggerAction: 'all', 
    emptyText:'Select a state...', 
    selectOnFocus:true, 
    applyTo: 'local-states' 
    }); 
    </script> 

<div> 
<input type="text" id="local-states" size="20"/> 
</div> 
<div id="local-states" style="margin-top:10px"> 

</body> 
</html>

kaynak

2011-02-03 Precise-One

, sen Ext JS dosyalarına referanslarınız emin doğru vardır vardır? Önbelleğe alma sorunu olmadığını kontrol etmek için tarayıcı önbelleğini temizlediniz mi? – wimvds

@wimvds: düzeltildi. Oradaydı '});' Javascript'in sonunda eksik. –

kapsamı, kapsam, kapsam

 
Ext.onReady(function(){ 
    Ext.QuickTips.init(); // simple array store 
    var exampleData2 = [['1', 'hello'],['2', 'hi'],['3', 'bye']]; 
    var store = new Ext.data.ArrayStore({ 
    fields: ['abbr', 'state'], 
    data : exampleData2 
    // or even better data : [['1', 'hello'],['2', 'hi'],['3', 'bye']] 
    // next to change: combo.getStore().loadData(new_table); 
    }); 
    var combo = new Ext.form.ComboBox({ 
    store: store, 
    displayField:'state', 
    typeAhead: true, 
    mode: 'local', 
    forceSelection: true, 
    triggerAction: 'all', 
    emptyText:'Select a state...', 
    selectOnFocus:true, 
    applyTo: 'local-states' 
    }); 
});

 
Ext.ux.states = Ext.Extend (Ex.form.ComboBox, { ....

kaynak

2011-02-04 04:20:33 bensiu

Aşağıda, bir mağaza oluşturduk daha karmaşık bir çözüm elde etmek, varsayılan ArrayStore uzanır Ext.data.FlatStore, aradı. Yapım aşamasında, yapılandırılmış veriler işlenir. Ama çalışmalıdır

{ 
    xtype: 'combo', 
    queryMode: 'local', 
    store: Ext.create('Ext.data.FlatStore', { 
     data: [ 'yes', 'no', 'maybe' ] 
    }) 
}

Demo @ JSFiddle

Ext.require(['*']); 

String.capitalize = function (str) { 
    return str.charAt(0).toUpperCase() + str.substr(1).toLowerCase(); 
}; 

Ext.define('Ext.data.FlatStore', { 
    extend: 'Ext.data.ArrayStore', 
    config: { 
     data: [] 
    }, 
    fields: [{ 
     name: 'id', 
     type: 'int' 
    }, { 
     name : 'value' 
    }, { 
     name: 'display', 
     type: 'string', 
     convert: function (newValue, model) { 
      return String.capitalize(model.get('value')); 
     } 
    }], 
    constructor: function (config) { 
     var me = this; 
     config.data = config.data.map(function (value, index, values) { 
      return [index, value]; 
     }); 
     me.callParent(arguments); 
     me.loaded = true; 
    } 
}), 

Ext.define('App.view.MainView', { 
    extend: 'Ext.panel.Panel', 
    xtype: 'mainView', 
    alias: 'widget.mainview', 
    controller: 'mainView', 
    title: 'Outer Panel', 
    referenceHolder: true, 
    layout: { 
     type: 'border' 
    }, 
    initComponent: function() { 
     var me = this; 
     me.items = [{ 
      region: 'center', 
      xtype: 'panel', 
      title: 'Inner Panel', 
      margin: 20, 
      bodyStyle: 'padding: 8px;', 
      layout: 'vbox', 
      items: [{ 
       xtype: 'combo', 
       store: Ext.create('Ext.data.FlatStore', { 
        data: [ 'yes', 'no', 'maybe' ] 
       }), 
       displayField: 'display', 
       valueField: 'value', 
       fieldLabel: 'Response', 
       typeAhead: true, 
       queryMode: 'local', 
       forceSelection: true, 
       triggerAction: 'all', 
       emptyText: 'Choose...', 
       selectOnFocus: true, 
       applyTo: 'local-states' 
      }] 
     }], 
     me.callParent(); 
    } 
}); 

Ext.define('App.controller.MainViewController', { 
    extend: 'Ext.app.ViewController', 
    alias: 'controller.mainView', 
    init: function() { 
     var me = this; 
    } 
}); 

Ext.define('App.app.App', { 
    extend: 'Ext.app.Application', 
    name: 'App', 
    launch: function() { 
     Ext.create('Ext.Viewport', { 
      layout: 'fit', 
      flex: 1, 
      items: [{ 
       xtype: 'mainview' 
      }] 
     }); 
    } 
}); 

Ext.onReady(function() { 
    Ext.application('App.app.App'); 
});

kaynak

2015-02-03 18:29:44

Yerel diziden ExtJs Combobox

cevap

İlgili konular