我的服务器代码正在返回json数据,它们选择了mysql查询。现在我必须解析这些信息,我需要将json信息填入表中,我将如何做到这一点?
我的服务器代码
<?php
header('Access-Control-Allow-Origin: *');//Should work in Cross Domaim ajax Calling request
mysql_connect("localhost","root","2323");
mysql_select_db("service");
if(isset($_POST['type']))
{
if($_POST['type']=="carpenter"){
$startDate=$_POST['startDate'];
$endDate=$_POST['endDate'];
$query="select * from booking where scheduledDate between $startDate AND $endDate";
$result=mysqi_query($query);
$count=mysql_num_rows($result);
$retVal=array();
while($row=mysqli_fetch_assoc($result)){
$$retVal[]=$row;
}
echo json_encode($retVal);
}
} else{
echo "Invalid Format";
}
我的剧本
<script>
function fetchData2(){
$(".data-contacts2-js tbody").empty();
var startDate=$('#datepicker1').val();
var endDate=$('#datepicker2').val();
$.ajax({
url: "http://localhost/service/cleaning.php",
type:"POST",
dataType:"json",
data:{type:"carpenter", startDate:startDate, endDate:endDate},
ContentType:"application/json",
success: function(response){
alert(obj);
},
error: function(err){
alert("fail");
}
});
}
$(document).ready(function(){
$(".data-contacts2-js tbody").empty();
$('#fetchContacts2').click(function() {
fetchData2();
});
});
</script>
我的HTML代码
<div class="block-content collapse in">
<div class="span12">
<table class="data-contacts2-js table table-striped" >
<thead>
<tr>
<th>ID</th>
<th>Customer Name</th>
<th>Customer Mobile</th>
<th>Customer Email</th>
<th>Address</th>
<th>Date</th>
<th>Time</th>
<th>Status</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<button id="fetchContacts2" class="btn btn-default" type="submit">Refresh</button>
</div>
我的Json格式是
[
{
"b_id": "101",
"cust_name": "qwq",
"cust_mobile": "323232323",
"cust_email": "u@gmail.com",
"cust_address": "kslaksl",
"scheduledDate": "2015-02-26",
"scheduledTime": "14:30:00",
"sc_id": "3",
"sps_id": "1"
}
]
我的数据库表格
答案 0 :(得分:1)
$。each()函数可用于迭代任何集合,无论它是对象还是数组。在数组的情况下,回调每次都传递一个数组索引和相应的数组值。在ajax成功内部尝试每个函数并循环遍历从php
file.Hope收到的响应数据,它给你一个想法配对.. :)
success: function(response){
$.each(response, function(idx, obj) {
$('table tbody').append(
$('<tr>')
.append($('<td>').append(obj.id))
.append($('<td>').append(obj.cust_email))
.append($('<td>').append(obj.cust_mobile))
);
});
},
<强> FYI 强>
答案 1 :(得分:1)
一种方法是使用$.each
并开始构建标记表行,然后将其放在tbody
标记内。
您可以在成功块中构建它们。这是基本的想法。
$.ajax({
url: "http://localhost/service/cleaning.php",
type: "POST",
dataType: "json",
data: {type:"carpenter", startDate:startDate, endDate:endDate},
success: function(response){
var rows = '';
$.each(response, function(index, element){
rows += '<tr>'; // build the row
$.each(element, function(key, val){
rows += '<td>' + val + '</td>'; // build the value
});
rows += '</tr>';
});
$('table tbody').html(rows);
}
});
旁注:根据您的代码,混合使用MySQLi和MySQL函数。
强制性注释:
Please, don't use
mysql_*
functions in new code。它们不再被维护and are officially deprecated。请参阅red box?转而了解prepared statements,并使用PDO或MySQLi - this article将帮助您确定哪个。如果您选择PDO here is a good tutorial。
我建议将PDO与准备好的陈述一起使用:
<?php
header('Access-Control-Allow-Origin: *');//Should work in Cross Domaim ajax Calling request
$db = new PDO('mysql:host=localhost;dbname=service', 'root', '2323');
$dbh->setAttribute( PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION );
if(isset($_POST['type'])) {
$startDate = $_POST['startDate'];
$endDate = $_POST['endDate'];
$query = 'SELECT * FROM booking WHERE scheduledDate BETWEEN :startDate AND :endDate';
$select = $db->prepare($query);
$select->bindParam(':startDate', $startDate);
$select->bindParam(':endDate', $endDate);
$select->execute();
$data = $select->fetchAll(PDO::FETCH_ASSOC);
echo json_encode($data);
exit;
}