26
4
我在使用 jQuery 和 PHP 从 AJAX 调用 JSON 响应时收到重复的值。代码运行完美，但在选择下拉列表时给出重复的条目。有两个下拉列表，第一个来自数据库的调用，基于第一个，值在第二个中传播。当选择第二个时，它将调用一个 java 脚本，该脚本使用 jQuery 从 AJAX 返回 JSON 响应，但返回值重复。
个人中心
文章发布
退出$(document).ready(function(){
$("#employee").change(function() {
//var id = $(this).find(":selected").val();
//var dataString = 'empid='+ id;
var b_code = $(this).find(":selected").val();
var dataString = 'empid='+ b_code;
$.ajax({
url: 'getData.php',
type: 'get',
dataType: 'JSON',
data: dataString,
success: function(response){
var len = response.length;
for(var i=0; i<len; i++){
var id = response[i].id;
var X1 = response[i].X1;
var X2 = response[i].X2;
var X3 = response[i].X3;
var X4 = response[i].X4;
var X5 = response[i].X5;
var tr_str = "<tr>" +
"<td align='center'>" + (i+1) + "</td>" +
"<td align='center'>" + X1 + "</td>" +
"<td align='center'>" + X2 + "</td>" +
"<td align='center'>" + X3+ "</td>" +
"<td align='center'>" + X4 + "</td>" +
"<td align='center'>" + X5+ "</td>" +
"</tr>";
$("#userTable").append(tr_str);
}
}
})
});
});<!DOCTYPE html>
<html>
<head>
<title>TSP</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="csss/bootstrap.min.css">
<link rel="stylesheet" href="csss/style1.css">
<!--</style> -->
<script type="text/javascript">
$(document).ready(function(){
$("#district").change(function(){
var district=$("#district").val();
$.ajax({
type:"post",
url:"getblock.php",
data:"district="+district,
success:function(data){
$("#employee").html(data);
}
});
});
});
</script>
</head>
<body>
<div class="container" style="margin-top: 50px;">
<div class="col-sm-6 col-sm-offset-3">
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title"><center>Select District & Block</center></h3>
</div>
<div class="panel-body">
District :
<select name="district" id="district">
<option>-select your district-</option>
<?php
include "db_connect.php";
//$result=mysqli_query("SELECT DTCode,DTName from district order by DTName");
$sql = "SELECT DTCode,DTName from district order by DTName";
$resultset = mysqli_query($conn, $sql) or die("database error:". mysqli_error($conn));
while($district = mysqli_fetch_assoc($resultset)){
echo "<option value=$district[DTCode]>$district[DTName]</option>";
} ?>
</select>
Block :
<select name="block" id="employee">
<option>-select your block-</option>
</select>
</div>
</div>
</div>
</div>
<div class="container">
<table id="userTable" border="2" >
<tr>
<th width="5%">S.no</th>
<th width="10%">X1</th>
<th width="10%">X2</th>
<th width="10%">X3</th>
<th width="10%">X4</th>
<th width="6%">X5</th>
</tr>
</table>
</div>
</body>
</html>
<script type="text/javascript" src="script/getDatan.js"></script>最佳答案
正如我在评论中提到的，您可以使用一个数组来存储您传递的 id，并且在每次迭代时您可以检查是否有重复的 id。
这是一个例子:
var testArray = [];
var len = response.length;
for(var i=0; i<len; i++){
if($.inArray(response[i].id, testArray)){ // check whether you have went over it already
continue;
}
testArray.push(response[i].id); // add the current id to the list and thats how you will avoid duplicates, assuming that the IDs are duplicate
var id = response[i].id;
var X1 = response[i].X1;
var X2 = response[i].X2;
var X3 = response[i].X3;
var X4 = response[i].X4;
var X5 = response[i].X5;
var tr_str = "<tr>" +
"<td align='center'>" + (i+1) + "</td>" +
"<td align='center'>" + X1 + "</td>" +
"<td align='center'>" + X2 + "</td>" +
"<td align='center'>" + X3+ "</td>" +
"<td align='center'>" + X4 + "</td>" +
"<td align='center'>" + X5+ "</td>" +
"</tr>";
$("#userTable").append(tr_str);
希望这有帮助!
关于javascript - 防止 jquery 在表中追加重复值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47528182/
26
4
0