2014-09-06 3 views
0

У меня есть текстовое поле asp.net, связанное с плагином автозаполнения. При этом у меня есть расширение для этого плагина, который автоматически выбирает соответствующий элемент, когда пользователь вместо выбора просто нажимает клавишу вкладок (размытие). Ниже приведен код для этого. Проблема в том, что первый раз размытие событий вызывает правильно, и вся функциональность работает очень хорошо. Но во второй раз он вообще не работает, и он принимает значение только 1-го элемента.Response.Redirect не работает после входа в приложение ASP.NET

Сценарий в моем случае такой. У меня есть текстовое поле и кнопка добавления. Текстовое поле имеет функцию автозаполнения, когда я печатаю слово «грамм», и он заполняет все единицы. Поскольку грамм является одним из единиц в источнике данных, нажатие на вкладку будет принимать это, и когда я нажимаю кнопку, текстовый грамм и его соответствующий идентификатор будут добавлены в виде сетки. Затем текстовое поле станет пустым, чтобы добавить больше таких записей. Проблема заключается в том, что во второй раз, когда я набираю что-то, что соответствует параметру auto, предлагающему пункт меню, и нажмите кнопку Tab, событие размытия не срабатывает.

$(".ui-autocomplete-input").on("blur", function (event) { 
       debugger; 
       if ($(this)[0].id == $("#MainContent_TabContainer1_TabpanelNormal_textinput")[0].id) { 
        $.ajax({ 
         type: "POST", 
         contentType: "application/json; charset=utf-8", 
         url: "./AddRecipe.aspx/CheckIfRecipeTitleExists", 
         data: "{'title':'" + $('#' + 'MainContent_TabContainer1_TabpanelNormal_textinput').val() + "'}", 
         dataType: "text", 
         success: function (data) { 
          var oData = JSON.parse(data); 
          if (oData.d == "True") { 
           var textvalue = $('#MainContent_TabContainer1_TabpanelNormal_textinput').val(); 
           alert("Recipe title " + textvalue + " already exists in our database. Please choose another title."); 
           $('#MainContent_TabContainer1_TabpanelNormal_textinput').val(""); 
           $('#MainContent_TabContainer1_TabpanelNormal_textinput').focus(); 
          } 
         } 
        }); 
       } 
       var autocomplete = $(this).data("autocomplete"); 
       if (autocomplete.selectedItem) { return; } 
       var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex($(this).val()) + "$", "i"); 
       autocomplete.widget().children(".ui-menu-item").each(function() { 
        var item = $(this).data("item.autocomplete"); 
        if (matcher.test(item.label || item.value || item)) { 
         autocomplete.selectedItem = item; 
         return false; 
        } 
       }); 
       if (autocomplete.selectedItem) { 
        autocomplete._trigger("select", event, { item: autocomplete.selectedItem }); 
       } 
      }); 

Пожалуйста, помогите мне понять, почему второй раз он не срабатывает.

+0

Минимальный пример с HTML, например. в JSFiddle, было бы полезно для такой проблемы –

ответ

0

Без полного примера я могу только предположить, основываясь на описанном поведении.

Попробуйте использовать делегированные события для размытия вместо:

$(document).on('blur', ".ui-autocomplete-input", function (event) { 

Это будет работать селектор JQuery после пузыря событий до не-изменяя предок элемент, затем применяет селектор, а затем применяет функцию к любому соответствующие элементы, вызвавшие событие. Это работает с динамически меняющимися элементами DOM, поэтому может решить вашу проблему.

+0

Код довольно большой, и мне нужно включить много вещей, чтобы показать на скрипаче. Я определенно попытаюсь создать кое-что, чтобы показать это на скрипаче. К этому времени вопрос очень прост. Регистрация обработчика события размытия с включенным, почему он выполняется только в первый раз, а не во второй раз для одного и того же элемента управления. Управление получает свои имена классов и другие вещи, такие как автозаполнение меню динамически через js. Я попробовал материал, который вы предлагали, но не работал – user2861226

Смежные вопросы