如何在表格中添加自动填充结果?

时间:2019-06-10 21:19:47

标签: jquery jquery-ui-autocomplete

我正在尝试使用自动完成形式获得的结果来构建表。我尝试在response内添加一个点击功能,但我刚刚成功,打印了一条警报,其中包含我想要的更多信息。

JS文件

 $(document).ready(function(){
    $("#autocomplete").autocomplete({
      source: function(request,response){
        $.ajax({      
          type: "POST",
          url: "{{url_for('auto')}}",
          data: $('#formautocomplete').serialize(),

          beforeSend: function(){
           //$('#autocomplete').addClass('ui-autocomplete-loading');
          },

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

              return {
                label: item[0]+' - '+item[1], 
                value: item[0] 
              }
               //Put onclick function here printing an alert, but
              // was printed all data, no just one.

            }));                          
          }

        });
      }
    });
  });

HTML

 <div class="col">
     <form id="formautocomplete" method="POST" action="#"> 
      <input  class="autocomplete" id="autocomplete" name="autocomplete" placeholder="ID" type="text">
      <button type="button" id="buttonAdd" class="btn btn-outline-secondary btn-sm">Add</button>
     </form> 
    </div>


 <table class="table table-sm">
        <thead class="thead-default">
          <th>Id</th>
          <th>Name</th>
          <th>Type</th>
        </thead>
        <tbody>
         //Results here
        </tbody>
      </table>

0 个答案:

没有答案