10.07.2019, 06:31
|
Интересующийся
|
|
Регистрация: 17.02.2010
Сообщений: 16
|
|
Фабрика виджетов и autocomplite
Здравствуйте.
Прикрутил себе autocomplite на основе комбобокса.
https://jqueryui.com/autocomplete/#combobox
там идёт переопределение комбобокса и вот тут:
_removeIfInvalid: function( event, ui ) {
// Selected an item, nothing to do
if ( ui.item ) {
return;
}
// Search for a match (case-insensitive)
var value = this.input.val(),
valueLowerCase = value.toLowerCase(),
valid = false;
this.element.children( "option" ).each(function() {
if ( $( this ).text().toLowerCase() === valueLowerCase ) {
this.selected = valid = true;
return false;
}
});
// Found a match, nothing to do
if ( valid ) {
return;
}
// Remove invalid value
this.input
.val( "" )
.attr( "title", value + " didn't match any item" )
.tooltip( "open" );
this.element.val( "" );
this._delay(function() {
this.input.tooltip( "close" ).attr( "title", "" );
}, 2500 );
this.input.autocomplete( "instance" ).term = "";
},
в случае неверного ввода (отсутствует в списке), поле ввода очищается и выводится сообщение.
Хотел сделать вместо этого добавление нового элемента при помощи ajax.У меня это даже получилось, до того момента, пока на форме не появилось два комбобокса. Если переопределить в $.widjet(), то все комбобоксы будут вести себя одинаково. В случае с очисткой и выводом сообщения это хорошо. Но мне нужно выполнять разные ajax-запросы с различными параметрами для каждого комбобокса.
Соответственно, мне необходимо переопределять эту функцию для каждого комбобокса, но как это сделать, ума не приложу. Натолкните на правильную мысль, пожалуйста.
|
|
10.07.2019, 08:08
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,068
|
|
Misha_White,
в селекте в атрибуте data-url укажите ссылку.
<select class="combobox" data-url="http" >
this.url = this.element.data("url");
|
|
10.07.2019, 08:36
|
Профессор
|
|
Регистрация: 07.11.2013
Сообщений: 4,662
|
|
Misha_White, для каждого отдельно параметры в jquery-ui так передаются: $( "#combobox" ).combobox({ param1: 'value1', param2: 'value2' }), а внутри функций станет доступно так: this.options.param1, this.options.param2 и тд. Здесь можно почитать про устройство фабрики.
|
|
10.07.2019, 08:56
|
Интересующийся
|
|
Регистрация: 17.02.2010
Сообщений: 16
|
|
Да, с параметрами я уже сделал. Просто думал, что это похоже на костыли.
Теперь вопрос о том же, но в другом.
На форме есть combobox, в котором, при отсутствии значения выполняется функция добавления значения. И есть другой комбобокс, в котором необходимо использовать механизм по-умолчанию. т.е. как в примере.
Можно, конечно, опять параметр передавать, типа флаг и исходя из этого параметра выполнять определённые действия...
Но я думал, что можно как-то при создании экземпляра ($('#selector').combobox()) переопределять функцию, которая отрабатывала бы ввод...
код из примера:
this._on( this.input, {
autocompleteselect: function( event, ui ) {
ui.item.option.selected = true;
this._trigger( "select", event, {
item: ui.item.option
});
},
autocompletechange: "_removeIfInvalid"
});
autocompletechange: как-то подменять, может...
|
|
10.07.2019, 09:12
|
Интересующийся
|
|
Регистрация: 17.02.2010
Сообщений: 16
|
|
Пока сделал так:
$.widget( "custom.combobox", {
options:{
func:"_removeIfInvalid", //действие по умолчанию
url:"/failajaxlink",
....//ещё параметры для формирования AJAX запроса и диалоговых окон.
},
.....
this._on( this.input, {
autocompleteselect: function( event, ui ) {
ui.item.option.selected = true;
this._trigger( "select", event, {
item: ui.item.option
});
},
autocompletechange: this.options.func
});
Последний раз редактировалось Misha_White, 10.07.2019 в 09:15.
|
|
10.07.2019, 09:15
|
Профессор
|
|
Регистрация: 07.11.2013
Сообщений: 4,662
|
|
Misha_White, так параметр может быть и функцией:
_removeIfInvalid: function( event, ui ) {
this.options.myFunc.call(this, event, ui);
}
Последний раз редактировалось Rise, 10.07.2019 в 09:18.
|
|
10.07.2019, 09:34
|
Интересующийся
|
|
Регистрация: 17.02.2010
Сообщений: 16
|
|
Не догоняю...
т.е. я в options myFunc пишу код функции по умолчанию? и в случае необходимости предаю другую функцию при создании?
$.widget( "custom.combobox", {
options:{
myFunc:function( event, ui ) {
// Selected an item, nothing to do
if ( ui.item ) {
return;
}
// Search for a match (case-insensitive)
var value = this.input.val(),
valueLowerCase = value.toLowerCase(),
valid = false;
this.element.children( "option" ).each(function() {
if ( $( this ).text().toLowerCase() === valueLowerCase ) {
this.selected = valid = true;
return false;
}
});
// Found a match, nothing to do
if ( valid ) {
return;
}
// Remove invalid value
this.input
.val("")
.attr( "title", "\'"+value + "\' отсутсвует в справочнике. Для добавления обратитесь к Администратору" )
.tooltip( "open" );
this.element.val( "" );
this._delay(function() {
this.input.tooltip( "close" ).attr( "title", "" );
}, 2500 );
this.input.autocomplete( "instance" ).term = "";
},
},
.....
this._on( this.input, {
autocompleteselect: function( event, ui ) {
ui.item.option.selected = true;
this._trigger( "select", event, {
item: ui.item.option
});
},
autocompletechange: "_removeIfInvalid"
});
....
_removeIfInvalid: function( event, ui ) {
this.options.myFunc.call(this, event, ui);
}
и затем:
$('#selector').combobox({myFunc:function( event, ui ) {
// Selected an item, nothing to do
if ( ui.item ) {
return;
}
// Search for a match (case-insensitive)
var value = this.input.val(),
valueLowerCase = value.toLowerCase(),
valid = false;
this.element.children( "option" ).each(function() {
if ( $( this ).text().toLowerCase() === valueLowerCase ) {
this.selected = valid = true;
return false;
}
});
// Found a match, nothing to do
if ( valid ) {
return;
}
// add invalid value
....
})
Последний раз редактировалось Misha_White, 10.07.2019 в 09:43.
|
|
10.07.2019, 09:43
|
Профессор
|
|
Регистрация: 07.11.2013
Сообщений: 4,662
|
|
Misha_White, ну повторяющийся код можешь оставить в _removeIfInvalid.
|
|
10.07.2019, 09:48
|
Интересующийся
|
|
Регистрация: 17.02.2010
Сообщений: 16
|
|
ага. Спасибо.
Вот как-то так я изначально и хотел сделать, только не знал как
|
|
10.07.2019, 10:53
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,068
|
|
Misha_White,
если в функциях различаются только ajax-запросы с различными параметрами, то зачем две функции?
|
|
|
|