首页 > 解决方案 > 在新创建的输入中自动完成

问题描述

嗨,我尝试为新生成的输入项名称创建自动完成...我的自动完成功能在静态输入下工作正常,但是当我添加新的项名称输入文本时,我希望这个当前输入具有自动完成功能

此代码用于创建 itemname 输入

<script type="text/javascript">
         function addField (argument) {
                var myTable = document.getElementById("crud_table");
                var currentIndex = myTable.rows.length;
                var currentRow = myTable.insertRow(-1);
          var count = 1;
         
          count = count + 1;
          var html_code = "<td id='row"+count+"'>";
                var itemname = document.createElement("input");
                itemname.setAttribute("name", "itemname" + currentIndex);
                itemname.setAttribute("placeholder", "البند");
                itemname.setAttribute("class","itemname form-control");
                itemname.setAttribute("onchange","getitem(this)");
                var currentCell = currentRow.insertCell(-1);
                currentCell.appendChild(itemname);
               }
      </script>

这是添加按钮

<button type="button" name="add" onclick="addField();" class="btn btn-success btn-xs">+</button>

这个功能用于自动编译

<script type='text/javascript'>
      $( "#itemname1" ).autocomplete({
        source: function( request, response ) {
          // Fetch data
          $.ajax({
            url: "<?=base_url()?>index.php/stores_operations/itemlist",
            type: 'post',
            dataType: "json",
            data: {
              search: request.term
            },
            success: function( data ) {
              response( data );
            }
          });
        },
        select: function (event, ui) {
          // Set selection
           
          $('#itemname1').val(ui.item.label); // display the selected text
          $('#q1').val(ui.item.value); // save selected id to input
          return false;
        }
      });

    };
    </script> 

我怎么无法在自动完成功能中捕捉到新的 itemname[] ???

标签: javascriptautocomplete

解决方案


大家好,经过多次搜索并尝试修复,我找到了解决方案

在创建新输入时

 var itemname = document.createElement("input");
                itemname.setAttribute("name", "itemname" + currentIndex);
                itemname.setAttribute("placeholder", "البند");
                itemname.setAttribute("class","itemname form-control");
  i add this ----> itemname.setAttribute("onFocus","getitem(this)");
                itemname.setAttribute("id","itemname" + currentIndex);


 <script type='text/javascript'>
i add this ---->   function getitem(x){
     
    var item = document.getElementById('itemname');
     // Initialize 
    $(x).autocomplete({
        source: function( request, response ) {
          // Fetch data
          $.ajax({
            url: "<?=base_url()?>index.php/stores_operations/itemlist",
            type: 'post',
            dataType: "json",
            data: {
              search: request.term
            },
            success: function( data ) {
              response( data );
            }
          });
        },
        select: function (event, ui) {
          // Set selection
           
          $(x).val(ui.item.label); // display the selected text
          //$('#q1').val(ui.item.value); // save selected id to input
          return false;
        }
      });

     }  
    </script>

推荐阅读