在表中显示ajax响应

2024-04-28

显示.html:

<div id="display_result" style="display: none"><table class="table">
<p style="float: right;" >Select All<input type="checkbox" class="allcb" data-child="chk" checked/> </p>                                    
<thead>
  <tr>
     <th>Die No</th>    
     <th> Status </th>    
     <th> Location </th>    
     <th>Select</th>
  </tr>
</thead>
<tbody>
</table>
<div id ="issue_button">       
<input type="submit" id="submit" class="btn btn-success " value="Recieve" style="width: 150px;"></div>  
</div>

Ajax:

var data = JSON.stringify($("#form").serializeArray());
// alert(data);
$.ajax({ // Send the credential values to another checker.php using Ajax in POST menthod
type: 'POST',
data: {
list: data
},
url: 'die_recieving_process.php',
success: function(data) ){
$('#display_result').html(data);
}
});

die_receiving_process.php

while($fetch = mysql_fetch_array($query))
{
if($fetch[1] == "Table Rack" )
{
echo '<tr class="success"><td>'.$fetch[0].'</td><td>'.$fetch[1].'</td><td>'.$fetch[3] . '</td> <td><input type=checkbox class="chk" id=check_box value= '.$fetch[2].' name= check_list[]  </td>  </tr>';
}
else
{
echo '<tr class="warning"><td>'.$fetch[0].'</td><td>'.$fetch[1].'</td><td>'.$fetch[3] . '</td> <td><input type=checkbox class="chk"  id=check_box value= '.$fetch[2].' name= check_list[] checked </td>  </tr>';
}    
}   

嗨,display.html 中的朋友,我必须显示 die_receiving_process.php 中处理的结果。在ajax中,我已将所有值发送到die_receering_process.php,在获取结果后,我必须在display.html中显示结果


First在你的Javascript中,你有两个错误: 您的代码覆盖 div 的现有内容,即整个表... 并且在 success 函数声明中有一个不必要的括号

所以改变这个:

success: function(data) ){
$('#display_result').html(data);
}

对此:

success: function(data) {//remove unnecessary bracket
   $('#display_result tbody').html(data);//add data - to tbody, and not to the div
}

顺便说一下,使用$.post() http://api.jquery.com/jquery.post/你可以将 javascript 代码写得更短,如下所示:

var data = JSON.stringify($("#form").serializeArray());
$.post('die_recieving_process.php',{list:data},function(responseData){
    $('#display_result tbody').html(responseData); //added to tbody which is inside #display_result
    $('#display_result').show();
});

Second您需要关闭表格内的 tbody 标签

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在表中显示ajax响应 的相关文章

随机推荐