Да, это действительно мой третий или четвертый вопрос об автозаполнении jQuery UI. Мое последнее раздражение в том, что нажатие на кнопку «отправить» в форме, похоже, не считается «изменением» для jQuery. Когда мое поле ввода изменяется, jQuery запускает некоторый javascript для принудительного сопоставления со списком допустимых входных данных и их значений:
jQuery("#Resource").autocomplete({
source: function( request, response ) {
var matcher = new RegExp(jQuery.trim(request.term).replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&"), "i" );
var matches = jQuery.grep(resources, function(value) {
return matcher.test( value.label || value.value || value );
});
response(matches.length ? matches : [{ label: "No Result Found", value: "" }]);
},
focus: function(event, ui) {
jQuery('#Resource').val(ui.item.label);
return false;
},
select: function(event, ui) {
jQuery('#Resource').val(ui.item.label);
jQuery('#EmployeeNumber').val(ui.item.value);
return false;
},
change: function(event,ui) {
for(var i in resources){
jQuery('#EmployeeNumber').val("");
if(resources[i].label.toLowerCase()==jQuery('#Resource').val().toLowerCase()) {
jQuery('#EmployeeNumber').val(resources[i].value);
break;
}
}
}
});
Если ввод EmployeeNumber (скрытый) уже имеет значение, ввод недопустимого имени, а затем вставка или щелчок по полю ввода очищает это значение, однако , если вместо этого вы сразу же нажмете на форму Submit
кнопка, она не считается «изменением», а данные POST
включают предыдущее значение EmployeeNumber - что делает неправильный ввод «своего рода» правильным!
Есть ли какой-нибудь способ, которым я могу заставить jQuery распознавать, что нажатие кнопки «Отправить» также является изменением, или иначе я могу получить кнопку Submit
, чтобы уведомить jQuery о том, что вход Resource
был отключен из
UPDATE
В конце концов, я справился с этим, используя довольно хакерский метод - я отказался от события 'change' в окне автозаполнения и сделал это вручную, когда пользователь нажимает на кнопку submit. Теперь это работает так: если пользователь выберет имя, щелкнув раскрывающееся меню автозаполнения, значение EmployeeNumber будет заполнено кодом автозаполнения jQuery. Если пользователь просто вводит имя и нажимает submit, то сопоставление выполняется с помощью функции forceCheck (). Конечно, эта функция автоматически сопоставляется с первым именем, независимо от того, существует ли второе идентичное имя или нет, но, к сожалению, в том, что похоже на самую странную причуду, которую я когда-либо видел, любой код после окончания что цикл for выполняет , а не , даже если в цикле нет оператора return. После окончания цикла запрос на отправку просто продолжается ... это очень странно.
<fieldset class="submit">
<input id="Submit" name="Submit" type="Submit" class="Submit" value ="Submit" onclick="document.getElementById('Resource').value = jQuery.trim(document.getElementById('Resource').value);forceCheck();"/>
</fieldset>
...
<script type="text/javascript">
...
// Force a resource name check when the user hits the submit button. Necessary because if user changes Resoruce
// input then hits submit directly (no click or tab off), the jQuery 'change' event (see below) isn't fired
// until *after* the submit button has begun processing, which is too late.
function forceCheck() {
for(var i in resources) {
document.getElementById("EmployeeNumber").value = "";
if(resources[i].label.toUpperCase() == document.getElementById("Resource").value.toUpperCase()) {
document.getElementById("EmployeeNumber").value = resources[i].value;
return;
}
}
}
jQuery(function(){
jQuery("#Resource").autocomplete({
source: function( request, response ) {
var matcher = new RegExp(jQuery.trim(request.term).replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&"), "i" );
var matches = jQuery.grep(resources, function(value) {
return matcher.test( value.label || value.value || value );
});
response(matches.length ? matches : [{ label: "No Result Found", value: "" }]);
},
focus: function(event, ui) {
jQuery('#Resource').val(ui.item.label);
return false;
},
select: function(event, ui) {
jQuery('#Resource').val(ui.item.label);
jQuery('#EmployeeNumber').val(ui.item.value);
return false;
},
});
});
</script>
Если кто-нибудь знает лучший способ, чем этот, я был бы очень признателен за ваш ответ - или если вы знаете, почему остальная часть моей функции forceCheck может не работать ... В противном случае я опубликую это сообщение как ответ на свой собственный. Завтра задай вопрос и приму его, когда смогу (думаю, через 2 дня).
Окончательное обновление :
Что ж, прошло более 24 часов (довольно много), поэтому я разместил свое решение в качестве «ответа». Я оставлю это еще на несколько дней, а затем приму, если другого ответа нет.