Yii: Автокомплит CJuiAutoComplete для выбора значения поля из другой модели и добавления этого значения в поле
Делаем выпадающий список на javascript для выбора значения из другой модели (таблицы, Movie) в поле текущей модели (Article). Для автокомплита (выпадающий список со значениями, которые соответствуют набираемому в поле тексту) в Yii используется виджет CJuiAutoComplete (до версии Yii 1.1.3 был CAutoComplete).
Он построен на JQuery (см. описание Autocomlete widget).

1. В представлении /views/article/_form.php
<div class="row">
<?php echo $form->labelEx($model,'movie_id'); ?>
<?php echo CHtml::script("
function split(val) {
return val.split(/,\s*/);
}
function extractLast(term) {
return split(term).pop();
}
")?>
<?php $this->widget('zii.widgets.jui.CJuiAutoComplete', array(
'model'=>$model,
'attribute'=>'movie',
//'value' => $model->id,
'source'=>"js:function(request, response) {
$.getJSON('".$this->createUrl('suggest')."', {
term: extractLast(request.term)
}, response);
}",
'options'=>array(
'delay'=>300,
'minLength'=>2,
'showAnim'=>'fold',
'multiple'=>true,
'select'=>"js:function(event, ui) {
var terms = split(this.value);
// remove the current input
terms.pop();
// add the selected item
terms.push( ui.item.value );
// add placeholder to get the comma-and-space at the end
terms.push('');
this.value = terms.join(', ');
return false;
}",
),
'htmlOptions'=>array(
'size'=>'40'
),
));
// Для подсветки набираемого куска запроса в предлагаемом списке
Yii::app()->clientScript->registerScript('unique.script.identifier', "
$('#Article_movie').data('autocomplete')._renderItem = function( ul, item ) {
var re = new RegExp( '(' + $.ui.autocomplete.escapeRegex(this.term) + ')', 'gi' );
var highlightedResult = item.label.replace( re, '<b>$1</b>' );
return $( '<li></li>' )
.data( 'item.autocomplete', item )
.append( '<a>' + highlightedResult + '</a>' )
.appendTo( ul );
};
");
?>
</div>
2. В контроллере /controllers/ArticleController.php
public function actionSuggest(){
if (Yii::app()->request->isAjaxRequest && isset($_GET['term'])) {
$models = Movie::model()->suggestTag($_GET['term']);
$result = array();
foreach ($models as $m)
$result[] = array(
'label' => $m->title." (".$m->year.")",
'value' => $m->title,
'id' => $m->id,
);
echo CJSON::encode($result);
}
}
В модели Movie.php должны присутствовать поля – id, title, year.
3. Функция suggestTag, которую вызвали из модели Movie (находится в models/Movie.php)
public function suggestTag($keyword){
$tags=$this->findAll(array(
'condition'=>'title LIKE :keyword OR year LIKE :keyword',
'params'=>array(
':keyword'=>'%'.strtr($keyword,array('%'=>'\%', '_'=>'\_', '\\'=>'\\\\')).'%',
)
));
return $tags;
}
Замечание: при таком автокомплите в таблице, которая соответствует модели Article мы имеем поле 'movie', которое дублирует поле 'title' из таблицы Movie. Что не есть хорошо.
В курсе по Yii покажу как сделать автокомплит на CJuiAutoComplete более оптимизированным для базы данных, то есть сохранять в таблицу не значение, а id, который соответствует значению в другой таблице. Но отображать в поле CJuiAutoComplete именно значение (ведь id, как таковой, нам ни о чём не говорит, это только цифра).
P.S. В развитие темы - написали о том, как сделать Множественный автокомплит с помощью CJuiAutoComplete (автокомплит нескольких значений в одно поле).
almix
Разработчик Loco, автор статей по веб-разработке на Yii, CodeIgniter, MODx и прочих инструментах. Создатель Team Sense.
Вы можете почитать все статьи от almix'а.
- 14 Разработка приложения на Yii. Урок 14: Выводим список категорий как новый виджет на сайте (29.04.2015)
- 13 Разработка приложения на Yii. Урок 13: Внедряем категории для статей. (29.04.2015)
- 12 Разработка приложения на Yii. Урок 12: Профилирование приложения, включаем кеширование. (20.01.2015)
- 11 Yiico. Видеокурс по разработке сайта на Yii. Урок 11: Отладка приложения, включаем журналирование. (20.01.2015)
- 10 Yiico. Видеокурс по разработке сайта на Yii. Урок 10: Если ваше приложение находится не в корневой папке, а во вложенной. (19.10.2014)
- 9 Разработка сайта на Yii с нуля. Урок 9. Выборка статей определённого автора. (13.08.2014)
- 8 Разработка сайта на Yii с нуля. Урок 8. Вызов в моделях функции, общей для них. Как избегать дублирования кода? (25.07.2014)
- 7 Разработка сайта на Yii с нуля. Урок 7. Изменение количества выводимых записей на странице в CGridView. Включаем сессии Yii. (04.09.2013)
- 6 Разработка сайта на Yii с нуля. Урок 6. Автоматич. отправка оповещений об одобренных комментариях на email автора комментария (11.08.2013)
- 5 Разработка сайта на Yii с нуля. Урок 5. Переименовываем blog в yiico. Изменяем "Home" в breadcrumbs. Включаем Gzip-сжатие. (09.08.2013)
- 4 Курс по Yii с нуля. Урок 4. Дорабатываем простую работу с пользователями: хранение пароля при редактировании пользователя. (13.04.2013)
- 3 Курс по Yii с нуля. Урок 3. Создаём новых пользователей. Организуем простую систему авторизации. Аутентификация, пароли, соли. (20.07.2014)
- 2 Yii + Git (github) на Mac. (24.03.2013)
- 2 Курс по Yii с нуля. Урок 2. Переносим и настраиваем Yii и проект нашего сайта на рабочем сервере. Избавляемся от index.php в url (09.07.2014)
- 1 Курс по Yii с нуля. Урок 1. Устанавливаем Yii на локальном компьютере. Заводим проект будущего сайта. (10.03.2013)
- 0 Composer – пакетный менеджер PHP. Что и как? (22.07.2014)
- 0 MySQL: проверить содержится ли значение в поле столбца (в столбце хранится строка значений через запятую) (22.05.2014)
- 0 Yii: Статичные страницы (создание, редактирование, удаление) (28.04.2014)
- 0 Yii: Расширение ECKEditor = Связка ckeditor + kcfinder (визуальный редактор с бесплатным файловым менеджером) (28.04.2014)
- 0 Yii: Bootstrap tabs, делаем активной вкладку на которую выполняется переход по ссылке (20.03.2014)
- 0 Yii: Доступ к атрибуту модели из файла шаблона (Вызов в шаблоне какого-либо атрибута модели). (17.02.2014)
- 0 Yii: Множественный автокомплит с помощью CJuiAutoComplete (автокомплит нескольких значений в одно поле) (07.02.2014)
- 0 Yii: Фотогалерея через поведение (доработка расширения imagesgallerymanager) (08.03.2016)
- 0 Yii: Установка и настройка Yii-app заготовки приложения от Crisu83 (09.03.2014)
- 0 Twitter Bootstrap Carousel Crossfade (09.09.2013)
4 комментариев