jquery動態自動完成文本框url

我正在根據用戶輸入生成自動完成的動態文本框。jquery動態自動完成文本框url

var projects = [ 
     { 
      label: "Test12", 
      desc: "responsive web application kit" 
     }, 
     { 
      label: "Londinium", 
      desc: "responsive bootstrap 3 admin template" 
     }, 
     { 
      label: "It's Brain", 
      desc: "Bootstrap based " 
     } 
    ]; 

    // Initialize autocomplete 
    $(document).on('click', '.ac-custom', function() { 
     $(this).autocomplete({ 
      minLength: 0, 
      source: function (request, response) 
      { 
       $.ajax({ 
        url: "/Home/GetInfo", 
        type: "POST", 
        dataType: "json", 
        data: { Name: $(this).val() }, 
        success: function (data) { 


        } 
       }); 
      }, 
      focus: function (event, ui) { 
       $(this).val(ui.item.label); 
       return false; 
      }, 
      select: function (event, ui) { 
       $(this).val(ui.item.label); 
       return false; 
      } 
     }) 
     .autocomplete("instance")._renderItem = function (ul, item) { 
      return $("<li>").append("<span class='text-semibold'>" + item.label + '</span>' + "<br>" + '<span class="text-muted text-size-small">' + item.desc + '</span>').appendTo(ul); 
     } 
    });

如果我將源代碼作爲項目工作，但我需要從數據庫中獲取所以我調用一個操作方法，但不知何故這是行不通的。是因爲我綁定ajax調用在運行時創建的控件。您的幫助表示讚賞。由於

來源

2016-12-31 Johny Bravo

你需要從成功回調響應數據傳遞

// Initialize autocomplete 
    $(document).on('click', '.ac-custom', function() { 
     $(this).autocomplete({ 
      minLength: 0, 
      source: function (request, response) 
      { 
       $.ajax({ 
        url: "/Home/GetInfo", 
        type: "POST", 
        dataType: "json", 
        data: { Name: $(this).val() }, 
        success: function (data) { 
         response(data); 
        }, 
        error: function (jqXHR, exception) { 
         var msg = ''; 
         if (jqXHR.status === 0) { 
          msg = 'Not connect. Verify Network.'; 
         } else if (jqXHR.status == 404) { 
          msg = 'Requested page not found. [404]'; 
         } else if (jqXHR.status == 500) { 
          msg = 'Internal Server Error [500].'; 
         } else if (exception === 'parsererror') { 
          msg = 'Requested JSON parse failed.'; 
         } else if (exception === 'timeout') { 
          msg = 'Time out error.'; 
         } else if (exception === 'abort') { 
          msg = 'Ajax request aborted.'; 
         } else { 
         msg = 'Uncaught Error.'; 
         } 

         alert(msg + "<br/>responseText: " + jqXHR.responseText); 
        } 
       }); 
      }, 
      focus: function (event, ui) { 
       $(this).val(ui.item.label); 
       return false; 
      }, 
      select: function (event, ui) { 
       $(this).val(ui.item.label); 
       return false; 
      } 
     }) 
     .autocomplete("instance")._renderItem = function (ul, item) { 
      return $("<li>").append("<span class='text-semibold'>" + item.label + '</span>' + "<br>" + '<span class="text-muted text-size-small">' + item.desc + '</span>').appendTo(ul); 
     } 
    });

來源

2016-12-31 09:05:54

是這很好，但電話是不是由「/ Home/GetInfo」，所以沒有任何反應 –

添加錯誤回調，讓我們知道什麼是錯誤？我更新了代碼並添加了錯誤回調 –

更新這樣

source: function (request, response) { 
       $.ajax({ 
        url: '/Home/GetInfo', 
        data: { 'text': $.trim($('#yourtextboxid').val()) }, 
        dataType: 'json', 
        type: 'post', 
        success: function (data) { 
         response($.map(data, function (item) { 
          return { 
           label: item.name, 
           id: item.id 
          } 
         })); 
        } 
       }) 
      }

您源功能這將幫助你

來源

2016-12-31 09:29:19 Manoj

jquery動態自動完成文本框url

回答

相關問題