Question

自动完成功能无法按行运行，请帮助我。.

这是代码（JavaScript）

$(document).ready(function() {
        var count = 0;

        $("#add_btn").click(function(){
                count += 1;
            $('#container').append(
                         '<tr class="records">'
                     + '<td ><div id="'+count+'">' + count + '</div></td>'
                     + '<td><input class="code" id="code' + count + '" name="code_' + count + '" type="text"></td>'
                     + '<td><input class="nama" id="nama' + count + '" name="nama_' + count + '" type="text"></td>'
                     + '<td><input class="qty" id="qty' + count + '" name="qty_' + count + '" type="text"></td>'
                      + '<td><input class="price" id="price' + count + '" name="price_' + count + '" type="text"></td>'
                     + '<input id="rows_' + count + '" name="rows[]" value="'+ count +'" type="hidden"></td></tr>'
                );

            });

Answer 1

$(document).ready(function() {
   var count = 0;

 var availableTags = [
      "ActionScript",
      "AppleScript",
      "Asp",
      "BASIC",
      "C",
      "C++",
      "Clojure",
      "COBOL",
      "ColdFusion",
      "Erlang",
      "Fortran",
      "Groovy",
      "Haskell",
      "Java",
      "JavaScript",
      "Lisp",
      "Perl",
      "PHP",
      "Python",
      "Ruby",
      "Scala",
      "Scheme"
    ];
    
        $("#add_btn").click(function(){
                count += 1;
            $('#container').append(
                         '<tr class="records">'
                     + '<td ><div id="'+count+'">' + count + '</div></td>'
                     + '<td><input class="code" id="code' + count + '" name="code_' + count + '" type="text"></td>'
                     + '<td><input class="nama" id="nama' + count + '" name="nama_' + count + '" type="text"></td>'
                     + '<td><input class="qty" id="qty' + count + '" name="qty_' + count + '" type="text"></td>'
                      + '<td><input class="price" id="price' + count + '" name="price_' + count + '" type="text"></td>'
                     + '<input id="rows_' + count + '" name="rows[]" value="'+ count +'" type="hidden"></td></tr>'
                );

  
     $("#code"+count).autocomplete({
            source: availableTags,
            minLength:1,
            select:function(event,data){
                $('.nama').val(data.item.nama_);
                $('.price').val(data.item.price_);
            }

        });
        
        
            });
            
            
   
            
    
        
        
    });

  
<head>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
 
</head>

<body>
  <button id="add_btn">Add </button>
  <table id="container"> 
  
  </table>

 
 <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
 </body>

使用以下代码，在行追加到autocomplete后附加container呼叫事件

$(document).ready(function() {
    var count = 0

    $("#add_btn").click(function() {
      count += 1;
      $('#container').append(
        '<tr class="records">' +
        '<td ><div id="' + count + '">' + count + '</div></td>' +
        '<td><input class="code" id="code' + count + '" name="code_' + count + '" type="text"></td>' +
        '<td><input class="nama" id="nama' + count + '" name="nama_' + count + '" type="text"></td>' +
        '<td><input class="qty" id="qty' + count + '" name="qty_' + count + '" type="text"></td>' +
        '<td><input class="price" id="price' + count + '" name="price_' + count + '" type="text"></td>' +
        '<input id="rows_' + count + '" name="rows[]" value="' + count + '" type="hidden"></td></tr>'
      );

        $("#code" + count).autocomplete({
          source: "do.php",
          minLength: 1,
          select: function(event, data) {
            $('.nama').val(data.item.nama_);
            $('.price').val(data.item.price_);
          }
        });

    });

});

Answer 2

这是来自do.php的代码

<?php
$conn = @mysql_connect('localhost','root','');
if (!$conn) {
    die('Could not connect: ' . mysql_error());
}
mysql_select_db('coba', $conn);

$q = $_GET['term']; // variabel $q untuk mengambil inputan user
$sql = mysql_query("SELECT * FROM obat_farmasi WHERE kode_obat LIKE '%".$q."%'"); 

while ($data = mysql_fetch_array($sql)){

        $row['value']    =$data['kode_obat'];
        $row['nama_']    =$data['nama_obat'];
        $row['price_']    =$data['harga_satuan'];
        $row_set[]        =$row;
}
//echo json_encode($result);
echo json_encode($row_set);
?>

自动完成功能在添加行中不起作用

2 个答案: