JQuery, Выбирайте операторы case с функциями и получая все это

Question

У вас возникла проблема, с которой я пробовал работать в течение последних двух-двух дней и не могу понять.

Название не делает вопрос справедливости - это немного сложнее/труднее объяснить.

Так что у меня этот код для настраиваемого DropSearch:

<% Select Case dtype%> 
<% Case "postbasic"%> 
<div class="SearchOverallbox" style="<%= sstyle %>"> 
<asp:TextBox ID="SearchBox" class="SearchBoxstyle InputClass" runat="server" onkeyup="RefreshUpdatePanel();" AutoCompleteType="Enabled"></asp:TextBox> 
<asp:ListBox ID="SearchList" class="SearchListstyle DropDownClass" runat="server" AutoPostBack="false" onclick="listclick();" Style="display: none;"></asp:ListBox> 
<script type="text/javascript"> 
    function RefreshUpdatePanel() { 
     if ($('#<%=SearchBox.ClientID%>').val() !== "") { 
      $('#<%=SearchList.ClientID%>').show(); 
      $.ajax({ 
       type: "POST", 
       url: "../Controls/ServerCalls.aspx/SearchDrop", 
       data: JSON.stringify({ 
        SearchVal: $("#<%=SearchBox.ClientID%>").val(), 
        Type: "<%=query %>" 
       }), 
       contentType: "application/json; charset=utf-8", 
       async: false, 
       cache: false, 
       dataType: "json", 
       success: function (msg) { 

        var htmlSelect = document.getElementById('<%=SearchList.ClientID%>'); 
        if (msg.d.length > 0) { 
         htmlSelect.innerHTML = msg.d; 
        } 
       }, 
       error: function() { 
        alert("An error has occurred during processing your request."); 
       } 
      }) 
      } 
      else { 
       $('#<%=SearchList.ClientID%>').hide(); 
      $('#<%=SearchList.ClientID%>').empty(); 

     } 
    } 

    function listclick() { 
     $("#<%=SearchBox.ClientID%>").val($("#<%=SearchList.ClientID%> :selected").text()); 
     document.getElementById('<%=SearchList.ClientID%>').innerHTML = ""; 
     $('#<%=SearchList.ClientID%>').hide(); 
    } 
</script> 

Теперь у меня есть несколько текстовых полей, которые имеют 'postbasic', как вышеупомянутая 'DTYPE'.

Таким образом, каждый из моих элементов управления полностью заполняет этот код во время выполнения, и отладка этого в Chrome/IE показывает, что каждый элемент управления имеет этот скрипт, прикрепленный к нему, с каждым определением, каким он должен быть.

Однако, когда я перехожу на страницу и пытаюсь проверить это, она переходит к последнему элементу управления с прикрепленным к нему сценарию и проходит через него - даже если я пишу в элементе управления текстовыми полями на самом верху ,

например. Если я заполняю описание вверху, он проверяет, имеет ли номер поставщика в самом низу какой-либо текст в нем, а если есть что-либо, он показывает DropList, прикрепленный к элементу управления поставщиком, а не в текстовом поле описания.

Любая помощь будет оценена по достоинству. Дальнейшие разъяснения доступны в случае необходимости.

С уважением,

Dee.

Answer 1

Итак, я выяснил обходное решение, которое работает для меня. Это немного неопрятно, но с немного большей работой я получу это красиво и аккуратно, но функциональность была тем, чем я был, и у меня это получилось. Кроме того, он позволяет мне избавиться от каждого отдельного случая для каждого из текстовых полей, поэтому я очистил около 400 строк избыточного кода.

Код:

<script> 
    $('.SearchOverallbox').on('keyup', function(){ 
     var CurrentTextBox = $('*:focus').attr('id'); 
     var CurrentListBox = CurrentTextBox.replace("SearchBox", "SearchList") 

     var splitFirstUS = CurrentTextBox.indexOf("_", 0) 
     var splitLastUS = CurrentTextBox.lastIndexOf("_") 
     var queryString = CurrentTextBox.substring(splitFirstUS+1, splitLastUS) 

     if(CurrentTextBox.length > 1){ 
      $("#" + CurrentListBox).show(); 
      $.ajax({ 
       type: "POST", 
       url: "../Controls/ServerCalls.aspx/SearchDrop", 
       data: JSON.stringify({ 
        SearchVal: $("#" + CurrentTextBox).val(), 
        Type: queryString 
      }), 
      contentType: "application/json; charset=utf-8", 
      async: false, 
      cache: false, 
      dataType: "json", 
      success: function (msg) { 

       var htmlSelect = document.getElementById(CurrentListBox); 
       if (msg.d.length > 0) { 
        htmlSelect.innerHTML = msg.d; 
       } 
      }, 
      error: function() { 
       alert("An error has occurred during processing your request."); 
      } 
     }) 
    } 
    else { 
     $("#" + CurrentListBox).hide(); 
     $("#" + CurrentListBox).empty(); 

    } 
}); 

Надеется, что это помогает кто-то в одной лодке, как я был (хотя я сомневаюсь в этом!).

Dee.