2015-07-08 2 views
0

Я разрабатываю текстовое поле с автозаполнением с использованием автозаполнения пользовательского интерфейса jQuery. После этого я могу создать текстовое поле с автозаполнением, но произошло одно из них.Хотите предотвратить выбор конкретного элемента в jQuery UI AutoComplete

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

$(function (prefixText) { 
      $("textBox").autocomplete({ 
       autoFocus: false, 
       minLength: 0, 
       delay: 50, 
       source: function (request, response) { 

        var data = "{ 'prefixText': '" + prefixText 
          + "','count': '" + 30 
          + "','pixWidth': '" + 100 + "' }"; 

        $.ajax({ 
         type: "POST", 
         url: "Example.asmx/" + method, 
         cache: false, 
         data: data, 
         dataType: "json", 
         contentType: "application/json; charset=utf-8", 
         success: function (data) { 
          response($.map(data.d, function (item) { 
           return { 
            label: item.name, 
            id: item.id, 
            name: item.name 
           } 
          })) 
         } 
        }); 
       }, 
       select: function (event, ui) { 
        var id = ui.item.id 
        //not match guid type 
        if (id.match(/[0-9a-z]{8}-[0-9a-z]{4}-[0-9a-z]{4}-[0-9a-z]{4}-[0-9a-z]{12}/) === null) { 
         if ($("text_id") !== null) { 
          $("text_id").val(-1); 
         } 
         return false 
        } 
        else { 
         if ($("text_id") !== null) { 
          $("text_id").val(ui.item.id); 
         } 
         $("textBox").val(ui.item.name); 
        } 
       } 
      }); 
     }); 
}); 

Если кто-то знает ответ, пожалуйста, научите меня.

ответ

1

На примере отсюда: How to disable element in jQuery autocomplete list Я думаю, что этот код будет работать для вас:

$(function (prefixText) { 
     $("textBox").autocomplete({ 
      autoFocus: false, 
      minLength: 0, 
      delay: 50, 
      source: function (request, response) { 

       var data = "{ 'prefixText': '" + prefixText 
         + "','count': '" + 30 
         + "','pixWidth': '" + 100 + "' }"; 

       $.ajax({ 
        type: "POST", 
        url: "Example.asmx/" + method, 
        cache: false, 
        data: data, 
        dataType: "json", 
        contentType: "application/json; charset=utf-8", 
        success: function (data) { 
         response($.map(data.d, function (item) { 
          return { 
           label: item.name, 
           id: item.id, 
           name: item.name 
          } 
         })) 
        } 
       }); 
      }, 
      select: function (event, ui) { 
       var id = ui.item.id 
       //not match guid type 
       if (id.match(/[0-9a-z]{8}-[0-9a-z]{4}-[0-9a-z]{4}-[0-9a-z]{4}-[0-9a-z]{12}/) === null) { 
        if ($("text_id") !== null) { 
         $("text_id").val(-1); 
        } 
        return false 
       } 
       else { 
        if ($("text_id") !== null) { 
         $("text_id").val(ui.item.id); 
        } 
        $("textBox").val(ui.item.name); 
       } 
      } 
     }).data("ui-autocomplete")._renderItem = function (ul, item) { 
      //Add the .ui-state-disabled class and don't wrap in <a> if value is empty 
      var id = item.id 
      if (id.match(/[0-9a-z]{8}-[0-9a-z]{4}-[0-9a-z]{4}-[0-9a-z]{4}-[0-9a-z]{12}/) === null) { 
       return $('<li class="ui-state-disabled">'+item.label+'</li>').appendTo(ul); 
      } else{ 
       return $("<li>") 
       .append("<a>" + item.label + "</a>") 
       .appendTo(ul); 
      } 
     }; 
    }); 

Если вы можете предоставить рабочую версию кода (пункты могут быть также из заданного списка, не основанный на вызове ajax), это будет намного легче помочь.

+0

Г-н Декель, Благодарю вас за ответ. Я могу воплотить предотвращение выбора определенного элемента. Мой босс был доволен. Большое спасибо!! – Ryo

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