2014-11-05 106 views
0

我得到了正確的json響應,並且我把javascript警報檢查了一下,但是無法使用響應將數據填充到文本框中,爲什麼下面的代碼沒有返回項目列表到文本框下拉菜單。jquery自動完成json響應沒有填滿文本框

response($.map(data, function (item) { 

         alert(item.task_id); 
         // getPreventDefault(); 

          return { label: item.module_task, value: item.task_id}; 
        })) 

不工作,即它不填寫文本框,即使我item.task_id和item.module_task正確的成功塊內。 **

enter code here 


(function($){ 
    $(document).ready(function(){ 
    $(document).on('click', '.autocomplete', function(){ 
     $('[id^="repairRecordsTask"]').each(function() { 
     $(this).autocomplete({ 
      minLength:3, 
      open: function() { 
       // After menu has been opened, set width to 100px 
       $('.ui-menu') 
        .width(100); 
      } , 

      source : function(request, response) { 

       //alert("inside the autocomplete "); 
       $.ajax({ 
        // alert("inside ajax"); 
        url : "<%=request.getContextPath()%>/Task_Search_Controller.do", 
        type : "GET", 
        minLength: 3, 

        contentType: "application/json; charset=utf-8", 
        autoFill: true, 
        //term is the input from request object 
        data : { 
         term : request.term 
        }, 
        dataType : "json", 

        success : function(data) { 
           alert(data.toString()); 
        response($.map(data, function (item) { 

         alert(item.task_id); 
         // getPreventDefault(); 

          return { label: item.module_task, value: item.task_id}; 
        })) 

        }, 


        select: function (event, ui) { 
         alert("here"); 

         $(this).val(ui.item.module_task); 
         //$(this).val(ui.item.value); 
         //$("#txtAllowSearchID").val(ui.item.value); 
        } 


       /* error: function(jqXHR, textStatus, errorThrown){ 
         //alert("error is " + errorThrown.toString()); 
         // alert("error is " + textStatus); 
         // alert("json reponse is " +jqXHR.responseJSON); 
         // alert("json reponse is " +jqXHR.responseJSON); 

        }*/ 
        }); 

       } 
     }); 
     }); 

    $(document).on('autocompleteselect', '.autocomplete', function(event, ui) { 
       // alert("selected " + ui.item.value); 
       var selectedTask = ui.item.value; 
       lookUpDMCodeRea(selectedTask); 
    }); 
    }); 

}); 
})(jQuery); 

和我的JSON看起來像這樣

my json is like this 
    var data =[ 
          { 
           "task_id": "1539", 
           "module_task": "810-01" 
          }, 
          { 
           "task_id": "1540", 
           "module_task": "810-02" 
          }, 
          { 
           "task_id": "1541", 
           "module_task": "810-04" 
          }, 
          { 
           "task_id": "13175", 
           "module_task": "810-04" 
          } 
        ] 

回答

0

我認爲源應該是服務器代碼的網址你在哪裏得到的JSON,這是爲我工作,用PHP

jQuery(this).autocomplete({ 
    source: "<?php echo site_url("search_users.php"); ?>", 
    minLength: 1, 
    select: function(event, ui) { 

    //do something when a item is selected 
    console.log(ui.item.id); 


    } 
}).data("uiAutocomplete")._renderItem = function(ul, item) { 
     return jQuery("<li></li>") 
      .data("item.autocomplete", item) 
      .append(
        "<a style='cursor:pointer;'>"+ 
        "<table>" + 
        "<tr>" + 
         "<td width='30'>" + 
         "<img src= '"+item.img+"' width='20' height='25' /> " + 
         "</td>" + 
         "<td>" + 
         item.label + 
         "</td>" + 
        "</tr>" + 
        "</table>"+ 
        "</a>" 
        ) 
      .appendTo(ul); 
}; 

和我的JSON是:

   [ 
         { 
          "label": "Juan Perez", 
          "value": "Juan Perez", 
          "id": 25, 
          "img": "http://localhost/admin/resources/as45265f." 
         }, 
         { 
          "label": "Juan Perez", 
          "value": "Juan Perez", 
          "id": 25, 
          "img": "http://localhost/admin/resources/as45265f.jpg" 
         }, 
         { 
          "label": "Juan Perez", 
          "value": "Juan Perez", 
          "id": 25, 
          "img": "http://localhost/admin/resources/as45265f.jpg" 
         }, 
         { 
          "label": "Juan Perez", 
          "value": "Juan Perez", 
          "id": 25, 
          "img": "http://localhost/admin/resources/as45265f.jpg" 
         } 
       ] 
+0

不,我的代碼工作正常,直到它從ajax調用返回json對象後,我得到了上面顯示的格式的json後,響應無法在文本框中設置 – skalluri 2014-11-05 21:04:01

+0

有人可以幫我解決方案或任何替代方案解 – skalluri 2014-11-06 11:11:38