Question

我正在获得正确的json响应，我将javascript警告检查，但无法使用响应将数据填充到文本框中，为什么以下代码未将项目列表返回到文本框下拉列表。

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"
                            }
                     ]

Answer 1

我认为源代码应该是你得到json的服务器代码url，这对我有用，用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"
                        }
                 ]

jquery autocomplete json响应没有填满文本框

1 个答案: