如何在js脚本中正确包含自动完成功能?

时间:2018-03-24 23:53:38

标签: javascript php jquery

我尝试在js中包含一个自动完成功能,但我并不完全知道如何使用js行表格。

元素make。

注意:$t是一个增量元素

    $products_specification_ajax = OSCOM::link('products_specification_ajax.php');

          $output = <<<EOD
        <script type="text/javascript"><!--


          var specification_row = $t; // increment element 
// call token-input js for autocompletion : data list



            $(document).ready(function() {
            $("#specificationName' + specification_row + '").tokenInput("{$products_specification_ajax}" ,
                {
                  tokenLimit: 1,
                  resultsLimit: 5,
                  onResult: function (results) {
                    $.each(results, function (index, value) {
                      value.name = value.id + " " + value.name;
                    });
                    return results;
                  }
                });
          });

-- create new js row with all element

          function addSpecificationValue() {
           html  = '<tr id="specification-row' + specification_row + '">';

           html += '<td>';

-- input autocompketion call
           html += '  <input type="text" name="products_specification[' + specification_row + '][name]" value="" id="specificationName' + specification_row + '" class="form-control token-input" />';


           html += '  <input type="hidden" name="product_specification[' + specification_row + '][specification_id]" value="" />';
           html += '</td>';  
        //remove    
            html += '  <td class="text-md-right"><button type="button" onclick="$(\'#specification-row' + specification_row + '\').remove();" data-toggle="tooltip" title="Remove" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button></td>';
            html += '</tr>';

            $('#specification tbody').append(html);

            specification_row++;
        }
        </script>
    EOD;

html中的结果

<script type="text/javascript"><!--
  var specification_row = 3;


    $(document).ready(function() {
    $("#specificationName' + specification_row + '").tokenInput("http://....../products_specification_ajax.php" ,
        {
          tokenLimit: 1,
          resultsLimit: 5,
          onResult: function (results) {
            $.each(results, function (index, value) {
              value.name = value.id + " " + value.name;
            });
            return results;
          }
        });
  });


  function addSpecificationValue() {
   html  = '<tr id="specification-row' + specification_row + '">';

//specification_name
   html += '<td>';
   html += '  <input type="text" name="products_specification[' + specification_row + '][name]" value="" id="specificationName' + specification_row + '" class="form-control token-input" />';
   html += '  <input type="hidden" name="product_specification[' + specification_row + '][specification_id]" value="" />';
   html += '</td>';

//specification_text
   html += '  <td>';
   html += '<div class="input-group"><span class="input-group-addon"><img src="language/en-gb/en-gb.png" title="English" /></span><textarea name="products_specification[' + specification_row + '][product_specification_description][1][text]" rows="5" placeholder="Text" class="form-control"></textarea></div>';
   html += '  </td>';


// customers id
    html += '<td>';
    html += '  <select name="products_specification[' + specification_row + '][customers_group_id]" class="form-control"><specification value="0">text_customers_group</specification><specification value="0">Client normal</specification><specification value="1">Tarifs 1</specification><specification value="99">Tous les groupes clients</specification></select>';
    html += '</td>';

//status 
    html += '<td>';
    html += '  <select name="products_specification[' + specification_row + '][status]" class="form-control">Array</select>';
    html += '</td>';

//remove    
    html += '  <td class="text-md-right"><button type="button" onclick="$(\'#specification-row' + specification_row + '\').remove();" data-toggle="tooltip" title="Remove" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button></td>';
    html += '</tr>';

    $('#specification tbody').append(html);



    specification_row++;
}

1 个答案:

答案 0 :(得分:0)

你需要用java附加输入来写文档但是需要它的确切名称或id来识别你写的是哪一个,或者你可以改变所有输入有一个属性用于自动完成的输入 How to insert value of dynamically created input boxes into database https://www.w3schools.com/tags/att_input_autocomplete.asp Set the value of an input field

许多有用的东西。