Я использую автозаполнение jQuery UI, и я пытаюсь ограничить несколько результатов. В основном я создаю систему PM. Я использую автозаполнение для поля. Но я пытаюсь ограничить количество людей, на которые можно отправить одно сообщение. Так что ограничьте максимальный выбор до 25.
Есть ли способ ограничить это? Также любые идеи по визуальному индикатору, что они достигли максимума?
select: function( event, ui){ var terms = split( this.value ); if(terms.length <= 2) { // 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; } else { $(this).effect("highlight", {}, 1000); $(this).addClass("red"); $("#warnings").html("<span style='color:red;'>Max people reached</span>"); return false; } }
Это можно легко достичь, прослушивая события . Вы можете сделать красный цвет, например, добавив класс и удалив класс для автозаполнения. Я думаю, вы можете сделать это сами с небольшим усилием.
select: function( event, ui ) { var terms = split( this.value ); if(terms.length <= 2) { // 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; } else { var last = terms.pop(); $(this).val(this.value.substr(0, this.value.length - last.length - 2)); // removes text from input $(this).effect("highlight", {}, 1000); $(this).addClass("red"); $("#warnings").html("<span style='color:red;'>Max people reached</span>"); return false; } }
PS Я также думаю, что один из этих плагинов может быть подходящим благодаря google :
https://github.com/loopj/jQuery-Tokenizing-Autocomplete-Plugin
Выглядит неплохо на мой взгляд:
Нажмите ссылку, чтобы просмотреть демо-версию .
http://net.tutsplus.com/tutorials/javascript-ajax/how-to-use-the-jquery-ui-autocomplete-widget/