2
Я использую собственный объект фабрики виджета, чтобы заполнить входной массив autocomplete. Все работает нормально. После того, как пользователь отправит форму, он перенаправляется на ту же страницу, но с фильтрованным результатом (на основе всех значений POST). Дело в том, что я хотел бы, чтобы поле ввода автозаполнения было заполнено предыдущим полем POST. Но я не могу понять это жизнью. Я пытался заполнить вход сЗаполнение поля ввода автозаполнения с POST-значением (решено)
$j('.inputSelect').val("post_value");
Я побежал его после combobox был инициализирован, но это не сделать трюк. Кто-то сталкивался с тем же?
EDIT: Кажется, что поле со списком все еще не инициализировано, где я бы поставил код.
HTML/PHP
<input id="regionID" type="hidden" name="regionID" value="<?php echo $post_regionID; ?>"/>
<select id="region" name="region" class="autoSelect">
//foreach
<option <?php if($post_regionID == $numRegionID) echo ' selected="selected"'; ?> value="...">...</option>
</select>
Javascript
/** AUTOCOMPLETE ON SELECT */
(function ($j){
$j.widget("ui.combobox", {
_create : function(){
var input,
that = this,
wasOpen = false,
select = this.element.hide(),
selected = select.children(':selected'),
defaultValue = selected.text() || "",
wrapper = this.wrapper = $j("<span>")
.addClass("ui-combobox")
.insertAfter(select);
function removeIfInvalid(element){
var value = $j(element).val();
matcher = new RegExp("^" + $j.ui.autocomplete.escapeRegex(value) + "$", "i"),
valid = false;
select.children("option").each(function(){
if($j(this).text().match(matcher)){
this.selected = valid = true;
return false;
}
});
if(!valid){
//remove invalid value, as it didn't match anything
$j(element).val(defaultValue);
select.val(defaultValue);
input.data("ui-autocomplete").term = "";
}
}
input = $j("<input>")
.appendTo(wrapper)
.val(defaultValue)
.attr("title", $j(select.get(0)).attr('id'))
.attr("id", $j(select.get(0)).attr('id'))
.attr("name", $j(select.get(0)).attr('id'))
.attr("value", "")
.addClass("ui-combobox-input")
.width(select.width())
.autocomplete({
delay: 0,
minLength: 0,
autoFocus: true,
source : function(request, response){
var matcher = new RegExp($j.ui.autocomplete.escapeRegex(request.term), "i");
response(select.children("option").map(function(){
var text = $j(this).text();
var id = $j(this).val();
console.log(this);
if(this.value && (!request.term || matcher.test(text)))
return {
label : text.replace(
new RegExp(
"(?![^&;]+;)(?!<[^<>]*)(" +
$j.ui.autocomplete.escapeRegex(request.term) +
")(?![^<>]*>)(?![^&;]+;)", "gi"
), "<strong>$1</strong>"),
value : text.trim(),
regionId: id,
option: this
};
}));
},
select: function (event, ui){
var inputName = $j(input.get(0)).attr('id') + "ID";
var val = $j(ui.item.option).val();
$j("#" + inputName).val(val);
ui.item.option.selected = true;
that._trigger("selected", event, {
item : ui.item.option
});
},
change : function (event, ui){
if(!ui.item){
removeIfInvalid(this);
}
}
})
.addClass("ui-widget ui-widget-content inputSelect");
input.data("ui-autocomplete")._renderItem = function (ul, item){
return $j("<li>")
.attr("id", item.regionId)
.append("<a>" + item.label + "</a>")
.appendTo(ul)
.removeClass('ui-corner-all ui-state-default ui-state-active');
};
$j(".ui-autocomplete li").removeClass("ui-corner-all ui-state-hover ui-state-focus ui-state-active ui-state-default");
$j(".ui-autocomplete li a ").removeClass("ui-corner-all ui-state-hover ui-state-focus ui-state-active ui-state-default");
$j('<a>')
.attr("tabIndex", -1)
.appendTo(wrapper)
.button({
icons: {
primary: "selectArrow"
},
text: false
})
.removeClass("ui-corner-all ui-state-default")
.addClass("ui-combobox-toggle anchorSelect")
.mousedown(function(){
wasOpen = input.autocomplete("widget").is(":visible");
})
.click(function(){
input.focus();
if(wasOpen){
return;
}
//pass empty string as value to search for, displaying all results
input.autocomplete("search", "");
});
},
_destroy : function(){
this.wrapper.remove();
this.element.show();
},
});
})(jQuery);
Is .inputВыберите ввод типа скрытого или текстового? И просто чтобы убедиться, что я понимаю вашу проблему. Вы хотите заполнить текст последнего выбранного значения из автозаполнения после возврата страницы? – jhorton
Поле ввода combobox имеет класс .inputSelect (поле ввода создается скриптом). И да, вы меня правильно поняли. Я хочу, чтобы поле ввода заполнялось переменной POST. – acriel
Ваш код выглядит хорошо, поэтому я предполагаю, что вы используете $ J (document) .ready() для установки значения. Но мне интересно, запускается ли готовое событие до того, как будет создан элемент .inputSelect. Вы проверили длину селектора, чтобы убедиться, что он установлен? Всегда можно использовать setTimeout с задержкой в 10 миллисекунд, чтобы установить его. И страница, на которой была сделана полная запись, или вы используете вызов ajax, чтобы получить отфильтрованный список? – jhorton