Question

我需要什么：

当用户提交表单时，则加载了DataTable。

问题我面临的是当用户发布数据时数据附加在div上但是在ajax调用中没有加载数据表。

我使用过Ajax代码：

           var oTable; 
            if ($('#teamTable').size() > 0)
            {

            var oTable = $('#teamTable').dataTable({
            "sPaginationType": "bootstrap",
            "bJQueryUI":true,
            "bSort":false,
            "bPaginate":true, // Pagination True 
            stateSave: true,
            "iDisplayLength": 10,
            "bDestroy": true//storing the instance of the dataTable for futher use in the future
            });
            }


        $("#save_team").click(function() {
            alert("click");
        $.ajax({
        type: "POST",
        url: "asana_team.php",
        data: { people_name: $('#e2').val(), team_name:$('#teamname').val() },
        beforeSend : function(){
            $(".team_table").remove();
            $("#team_table_div").append("<center id=\"loading\" style=\"margin-top:25%;margin-bottom:25%\"><img src='../common/images/ajax-loader.gif' /></center>");
        },
        contentType: "application/x-www-form-urlencoded"
        }).done(function(data) {
            $("#loading").remove();
            $('#team_table_div').append(data);


           if ($('.table').size() > 0)
           {
               $('.table').dataTable({
                   "sPaginationType": "bootstrap",
                   "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>",
                   "oLanguage": {
                       "sLengthMenu": "_MENU_ records per page"
                   }
               });
           }

    });
    });

Html代码：

<div class="span6" style="padding-right:10px" id="team_table_div">
        <h4>Already Added Teams/Users</h4>
         <br />
        <div id="team_table">
         <!-- Table -->
        <table class="table-condensed table-hover table" id="teamTable">

           <!-- Table heading -->
      <thead>
       <tr>
     <th>Team Name</th>
     <th>People Name</th>
      <th></th>
      </tr>
         ``</thead>
<!-- // Table heading END -->

<!-- Table body -->
<tbody>
<?php
$team_store = mysql_query("select * from ess_teamname ORDER BY Team_Name ASC");
while ($team_store_row = mysql_fetch_assoc($team_store))
{
    //echo "select * from asana_users where User_id = '".$team_store_row['User_id']."' ";
$people_name = mysql_fetch_assoc(mysql_query("select * from asana_users where User_id = '".$team_store_row['User_id']."'"));

?>
<tr class="nofirst">
<td ><?php echo $team_store_row['Team_Name']; ?></td>
<td ><?php echo $people_name['Name']; ?></td>
<td><a href="javascript: return 0;" class="glyphicons remove_2" id="<?php echo "rmTeam".$team_store_row['Table_ID']; ?>" style="top:-6px"><i></i></a></td>
</tr>
<?php   } ?>
</tbody>
<!-- Table body END-->
</table>
</div>
</div>

DataTable未在Ajax调用上加载

0 个答案: