komal Singh Baghel Ответов: 1

ajax jquery autocomplete textbox не публикует обратно при выборе всплывающих списков


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"
type = "text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"
type = "text/javascript"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
rel = "Stylesheet" type="text/css" />
<script type="text/javascript"> 
   // if you use jQuery, you can load them when dom is read.
   $(document).ready(function () {
       var prm = Sys.WebForms.PageRequestManager.getInstance();    
       prm.add_initializeRequest(InitializeRequest);
       prm.add_endRequest(EndRequest);

       // Place here the first init of the autocomplete
       InitAutoCompl();
    });        

    function InitializeRequest(sender, args) {
    }

    function EndRequest(sender, args) {
       // after update occur on UpdatePanel re-init the Autocomplete
       InitAutoCompl();
    }

   function InitAutoCompl() {
       $("#txtSearch").autocomplete({
           source: function (request, response) {
               $.ajax({
                   url: '<%=ResolveUrl("~/Service.asmx/GetCustomers") %>',
                   data: "{ 'prefix': '" + request.term + "'}",
                   dataType: "json",
                   type: "POST",
                   contentType: "application/json; charset=utf-8",
                   multiple: true,
                   width: 400,
                   minChars: 2,
                   cacheLength: 1,
                   multipleSeparator: " ",
                   success: function (data) {
                       response($.map(data.d, function (item) {

                           return {
                               label: item.split('-')[0],
                               val: item.split('-')[1]
                           }
                       }))
                   },
                   error: function (response) {
                       alert(response.responseText);
                   },
                   failure: function (response) {
                       alert(response.responseText);
                   }
               });
           },
           select: function (e, i) {
               $("#<%=hfCustomerId.ClientID %>").val(i.item.val);
               var origEvent = event;
               while (origEvent.originalEvent !== undefined)
                   origEvent = origEvent.originalEvent;
               if (origEvent.type == 'keydown')
                   $("#bttnSearch").click();
               return true;  

           },

           minLength: 1
       });
      
  }    
  </script>


это то, что я получил до сих пор. В чем же моя проблема заключается
1) когда я навожу курсор мыши на всплывающие списки с помощью клавиши навигации клавиатуры, он отображает элементы в текстовом поле, но когда я использую мышь, он не отображается в текстовом поле.(?).
2) когда я выбираю элемент списка, он выбирается в текстовом поле, но не запускает событие textchange TextBox.(?).


мой aspx

<asp:UpdatePanel ID="up" runat="server"><contenttemplate>
     <asp:HiddenField ID="hfCustomerId" runat="server" />
<asp:Label ID="lblEmpCodeSrch" runat="server" Text="EmpCode" CssClass="label">   
 
  <asp:TextBox ID="txtSearch" runat="server" Width="815px" ToolTip="Enter Employeecode" 

            ontextchanged="txtSearch_TextChanged">
     <asp:Button ID="bttnSearch" runat="server" CssClass="submit" Height="23px" Text="Search" onclick="bttnSearch_Click" />
 </contenttemplate>

Здесь я попытался объяснить свой вопрос как следует. Любая помощь будет оценена по достоинству.

Sukanta Dey

Может быть, вы можете попробовать код, приведенный ниже:

$("#txtSearch").live("размытие", функция (событие) {
var autocomplete = $(this).data("автозаполнение");
ВАР совпадений = новое регулярное выражение("^" + $.пользовательского интерфейса.автозаполнение.escapeRegex($(это).функция val()) + "$", "я");
var myInput = $(это);
автозаполнение.виджет().дети(".интерфейс-меню-пункт").каждый(функция () {
//Проверьте, является ли каждый элемент автозаполнения совпадением без учета регистра на входе
var item = $(this).data("item.autocomplete");
если (совпадений.тест(поз.метка || поз.значение || пункта)) {
//Там было совпадение, давайте прекратим проверку
автозаполнение.элемент = элемент;
вернуть;
}
});
//если было совпадение триггер событие select на этом совпадении
//Я бы рекомендовал сопоставить метку с входными данными в событии select
если (автозаполнение.элемент) {
автозаполнение._trigger("select", событие, {
пункт: автозаполнение.selectedItem

});
//Сделай что-нибудь здесь

//совпадения не было, очистите вход
} еще {
$(это).val(");
selectedManagerId = 0;
}
});

1 Ответов

Рейтинг:
4

Sukanta Dey

$("#txtSearch").live("blur", function (event) {
            var autocomplete = $(this).data("autocomplete");
            var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex($(this).val()) + "$", "i");
            var myInput = $(this);
            autocomplete.widget().children(".ui-menu-item").each(function () {
                //Check if each autocomplete item is a case-insensitive match on the input
                var item = $(this).data("item.autocomplete");
                if (matcher.test(item.label || item.value || item)) {
                    //There was a match, lets stop checking
                    autocomplete.selectedItem = item;
                    return;
                }
            });
            //if there was a match trigger the select event on that match
            //I would recommend matching the label to the input in the select event
            if (autocomplete.selectedItem) {
                autocomplete._trigger("select", event, {
                    item: autocomplete.selectedItem

                });
        //Do something here

                //there was no match, clear the input
            } else {
                $(this).val('');
                selectedManagerId = 0;
            }
        });


komal Singh Baghel

Большое спасибо за долгое ожидание ответа.Спасибо, большое спасибо.