Автозаполнение jQuery возвращает пустой список, если в текстовом поле нет текста

Я использую автозаполнение jQuery с текстовым полем под asp.net mvc 2, и все работает нормально. Я набираю поиск, и он возвращает список результатов. Но если я наберу несколько символов, затем вернусь назад и сотру весь текст из текстового поля, я хочу, чтобы появился список элементов по умолчанию. К сожалению, вызов ajax для моего контроллера не запускается после возврата и удаления всего текста.

Одна вещь, которую я должен упомянуть, я использую автозаполнение немного по-другому. Я использую функцию автозаполнения, чтобы действовать как механизм фильтрации. Когда пользователь вводит текст в текстовое поле, выполняется вызов ajax, и результаты вводятся в тег div. Я не хочу, чтобы стандартный раскрывающийся список появлялся под текстовым полем, я просто хочу использовать функциональность, предоставляемую автозаполнением, для динамического отображения списка элементов на странице, когда я набираю строку фильтра.

Я делаю это, потому что список результатов исчисляется сотнями, и возможность ввести несколько символов и вернуть отфильтрованный результат значительно ускоряет поиск элемента в списке.

Чтобы обойти это, я попытался подключиться к событиям onchange / onkeypress / onkeyup в текстовом поле и т.д. и проверить, есть ли текст в текстовом поле, и если его нет, отобразить список по умолчанию. Но опять же не хочет у меня работать. Как будто события текстового поля не срабатывают, когда текст удаляется из текстового поля.

Я хотел бы найти способ, чтобы при удалении текста в текстовом поле поиск по умолчанию выполнялся автоматически.

Вот мой html ...

<% using (this.Html.BeginForm("Filter", "Guilds"))
       {%>
      Filter: 
    <input type="text" name="SearchFilterText" value="" id="filterTextBox" onkeyup="onfilterchange();" />
    <%
        }%>
         <script type="text/javascript">
             $(function () {
                 $("#filterTextBox").autocomplete({
                     source: [""],

                     search: function (event, ui) {
                         populatelist();
                         return true;
                     },
                     minLength: 1,
                     delay: 300
                 });
             });
                </script>
    <div id="success">
        <% Html.RenderPartial("GuildList", this.Model); %>
    </div>
    <div id="error">
    </div>

вот мой сценарий в головном разделе ....



 
              function populatelist() {
                    var url = "/FilteredGuilds///";
                   $.ajax({
                        url: url + $("#filterTextBox").val(), 
                        dataType: "html", 
                        success: function(response, status, xhr) {
                            $('#success').html(response);
                            $("#error").html("");
                        },
                        error: function(response, status, xhr) {
                            if (status == "error") {
                                $("#success").html("");
                                var msg = "Sorry but there was an error: ";
                                $("#error").html(msg + xhr.status + " " + xhr.statusText);
                            }
                        }            
                    });
              }

              function onfilterchange(){
                  if($("#filterTextBox").val() == null | $("#filterTextBox").val() ==""){
                    populatelist();
                  }
              }
              

А вот и действие моего контроллера ....



 [HttpGet]
        public PartialViewResult Filter(string realm, DateTime date, string filter)
        {
            var guildNames = this._repository.GetGuildNames(date, realm);
            if (string.IsNullOrEmpty(filter)) return PartialView("GuildList", guildNames);
            return PartialView("GuildList", guildNames.Where(x => x.Name.ToLower().Trim().Contains(filter.ToLower().Trim())).ToList());
        }


person Dean Lunz    schedule 26.07.2010    source источник
comment
см. мой ответ ниже для получения более подробной информации. Мне кажется, что ваш строковый фильтр, равный нулю, приведет к ошибке действия контроллера. вы остановили отладку в разделе возврата этого ?? Кроме того, я заметил, что ваш раздел url в коде jquery - это var url = / FilteredGuilds /// ;. Я не уверен, как оттуда попасть в «Фильтр» ?? (также, почему лишние /// символы ??   -  person jim tollan    schedule 26.07.2010


Ответы (1)


Дин,

Я думаю, что проблема может быть связана с кешем $ .ajax, который сохраняет ваши предыдущие выборы в локальном кеше. вы можете смягчить это до определенной степени, добавив:

$.ajaxSetup({ cache: false });

однако это, очевидно, будет означать, что введенный вами тип (при удалении символов из текстового поля) всегда будет запрашивать базу данных, что повлияет на производительность.

Я также рекомендую вам выполнить подробную трассировку в консоли firebug, поскольку это покажет любые ошибки, возникающие при выполнении запроса. вы можете обнаружить, что пустая / пустая строка вызывает ошибку на контроллере, и firebug выделит это.

Джим

person jim tollan    schedule 26.07.2010