Я работаю в extjs + php для автоматического завершения свойства combobox. У меня есть вид as-
Ext.define('Balaee.view.kp.Word.Word', { extend:'Ext.form.Panel', id:'WordId', alias:'widget.Word', title:'Dictionary', items:[ { xtype : 'combobox', fieldLabel : 'Enter the word', name : 'wordtext', displayField: 'word', valueField: 'word', allowBlank : false, emptyText : 'Enter the word', enableKeyEvents : true, autoSelect: true, id : 'wordtext', triggerAction:'all', typeAhead:true, typeAheadDelay:100, mode:'remote', minChars:1, forceSelection:true, hideTrigger:true, store:'kp.WordStore', listeners: { specialkey: function (f,e) { if (e.getKey() == e.ENTER) { this.up().down('button[action=SearchAction]').fireEvent('click'); } } } }, { xtype:'button', formBind: true, fieldLabel:'Search', action:'SearchAction', text:'Search', } ] }); Хранилище, связанное с указанным выше полем со списком, считывает URL-адрес функции с сервера, который имеет функцию as-
public function actionGetword() { $record1=Word::model()->findAll(); foreach($record1 as $record) { $main[]=array("wordId"=>$record->wordId,"word"=>$record->word); } echo "{ \"data\":".CJSON::encode($main)."} ";}
Таким образом, привязка магазина к приведенному выше combobox имеет все хранилища слов в базе данных. Если я пытаюсь вставить слово «таблица» в поле выше. Когда я пишу «ta», он дает мне предложения в раскрывающемся списке. Но его отображение всех слов. Но я хочу иметь слова, начинающиеся с «ta» только в поле предложений. Итак, как я могу это изменить? Кто-нибудь может мне помочь
У вас есть два способа сделать то, что вы хотите. Либо вы загружаете все данные одновременно, как и в настоящее время, и фильтруете на стороне клиента, либо фильтруете данные на стороне сервера. Решение 1 вызовет только один HTTP-запрос, комбо будет очень реактивным.
Если вы хотите фильтровать на сервере, вы должны поймать параметр «запрос» HTTP-запроса. Это настраивается с помощью опции queryParam в поле со списком.
Например:
$query = isset($_REQUEST['query']) ? $_REQUEST['query'] : false; $record1 = Word::model()->findAll(); $main = array(); foreach($record1 as $record) { // Only add data for records matching the query if ($query === false || substr($record->word, 0, strlen($query)) === $query) { $main[]=array("wordId"=>$record->wordId,"word"=>$record->word); } } echo "{ \"data\":".CJSON::encode($main)."} ";
С таким сервером клиентский код должен выглядеть так:
var store = Ext.create('Ext.data.JsonStore', { fields: ['wordId', 'word'] ,proxy: { // TODO... } }); Ext.widget('combo', { renderTo: 'comboCt' ,queryMode: 'remote' // you have this one wrong, 'mode' was in Ext 3 ,triggerAction: 'all' ,displayField: 'word' ,idField: 'wordId' ,minChars: 1 ,store: store // not needed because 'query' is the default, but you could customize that here ,queryParam: 'query' });
Для решения 1, который загружается один раз и фильтруется локально, вы должны установить queryMode в «local» и загрузить хранилище самостоятельно. Вы можете использовать метод store.load() или параметр autoLoad .
Пример кода клиента, который должен содержать слово с вашим сервером:
var store = Ext.create('Ext.data.JsonStore', { fields: ['wordId', 'word'] ,proxy: { // TODO... } // Load the store once ,autoLoad: true }); Ext.widget('combo', { renderTo: 'comboCt' // local means the combo will work with data in the store buffer ,queryMode: 'local' ,triggerAction: 'all' ,displayField: 'word' ,idField: 'wordId' ,store: store ,minChars: 1 });