我创建了一个动态添加和删除行的php程序,并使用数据库值自动填充输入字段。 第一次添加行时代码完美无缺,但代码没有显示添加第二行时所需的结果。 请提出解决方案,因为我是编码新手。
<html>
<head>
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
</head>
<body>
<div class="container">
<br />
<br />
<div class="col-md-3">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- webslesson_mainblogsec_Blog1_1x1_as -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-4529508631166774"
data-ad-host="ca-host-pub-1556223355139109"
data-ad-host-channel="L0007"
data-ad-slot="6573078845"
data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
<div class="col-md-9">
<div class="form-group">
<form name="add_name" id="add_name">
<div class="table-responsive">
<table class="table table-bordered" id="dynamic_field">
<tr>
<td><button type="button" name="add" id="add" class="btn btn-success">Add More</button></td>
</tr>
</table>
<input type="button" name="submit" id="submit" class="btn btn-info" value="Submit" />
</div>
</form>
</div>
</div>
</div>
</body>
</html>
<script>
$(document).ready(function(){
var i=0;
$('#add').click(function(){
i++;
$('#dynamic_field').append('<tr id="row'+i+'"><td><input type="text" name="country" id="country" class="form-control" placeholder="Enter Country Name" /><div id="countryList"></div></td><td><button type="button" name="remove" id="'+i+'" class="btn btn-danger btn_remove">X</button></td></tr>');
$(document).ready(function(){
$('#country').keyup(function(){
var query = $(this).val();
if(query != '')
{
$.ajax({
url:"fetch.php",
method:"POST",
data:{query:query},
success:function(data)
{
$('#countryList').fadeIn();
$('#countryList').html(data);
}
});
}
});
$(document).on('click', 'li', function(){
$('#country').val($(this).text());
$('#countryList').fadeOut();
});
});
});
$(document).on('click', '.btn_remove', function(){
var button_id = $(this).attr("id");
$('#row'+button_id+'').remove();
});
});
</script>
这是我的fetch.php代码 -
<?php
$connect = mysqli_connect("localhost", "root", "", "testing4");
if(isset($_POST["query"]))
{
$output = '';
$query = "SELECT * FROM tbl_country WHERE country_name LIKE '%".$_POST["query"]."%'";
$result = mysqli_query($connect, $query);
$output = '<ul class="list-unstyled">';
if(mysqli_num_rows($result) > 0)
{
while($row = mysqli_fetch_array($result))
{
$output .= '<li>'.$row["country_name"].'</li>';
}
}
else
{
$output .= '<li>Country Not Found</li>';
}
$output .= '</ul>';
echo $output;
}
?>