PHP-AJAX和MySQL选择过滤器xmlhttp.open不加载jquery数据表


PHP - AJAX and MySQL select filter xmlhttp.open not loading jquery datatables

使用此示例:http://www.w3schools.com/php/php_ajax_database.asp我已经设置了一个从数据库中回显的表。

我现在正试图在表上启动datatables插件,一切都设置正确,但它不起作用。我曾尝试在html和php页面中启动数据表,但似乎都不起作用。

结合这个例子,我也遇到了同样的问题:http://davidwalsh.name/animated-ajax-jquery

是不是第一个例子中的这一位导致了问题,因为页面在xmlhttp.open和xmlhttp.send()之前已经加载;已发送。

 xmlhttp.open("GET","getuser.php?username="+username+"&year="+str,true);
 xmlhttp.send();

磁头

        $(document).ready(function() {
      $('a.delete').click(function(e) {
        e.preventDefault();
        var parent = $(this).parent();
        $.ajax({
          type: 'get',
          url: 'jquery-record-delete.php',
          data: 'ajax=1&delete=' + parent.attr('id').replace('record-',''),
          beforeSend: function() {
            parent.animate({'backgroundColor':'#fb6c6c'},300);
          },
          success: function() {
            parent.slideUp(300,function() {
              parent.remove();
            });
          }
        });
      });
    });
        jQuery( function( $ ) {// Implements the dataTables plugin on the HTML table
var $adtTable= $("#academic_days_table").dataTable({
        "iDisplayLength": 30,       
        "sDom": '<"clear">t>',
        "aaSortingFixed": [[0,'asc']],
        "aoColumns": [
            { "bSortable": false },
            { "bSortable": false },
            { "bSortable": false },
            { "bSortable": false }
            ]
});
    });

HTML页面

 function showUser(str, username)
 {
 if (str=="")
   {
   document.getElementById("department_logs_txtHint").innerHTML="";
   return;
   } 
 if (window.XMLHttpRequest)
   {// code for IE7+, Firefox, Chrome, Opera, Safari
   xmlhttp=new XMLHttpRequest();
   }
 else
   {// code for IE6, IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
 xmlhttp.onreadystatechange=function()
   {
   if (xmlhttp.readyState==4 && xmlhttp.status==200)
     {
     document.getElementById("department_logs_txtHint").innerHTML=xmlhttp.responseText;
     }
   }
 xmlhttp.open("GET","getuser.php?username="+username+"&year="+str,true);
 xmlhttp.send();
 } 
<form>
    <select id="employee_user">
    <option value="">--</option>  
</select>
<select id="they" onchange="showUser(this.value, employee_user.value)">
<option value="">--</option>
    </select>
</form>

php页面

<?php
include_once("scripts/connection.php");
$year = $_GET["year"];
$username = $_GET["username"];
$is_academic_result = mysql_query('SELECT * FROM holiday_entitlement_academic WHERE employee = ''' . $username . ''' AND academic_year = ''' . $year . ''' ');
if($is_academic = mysql_fetch_array($is_academic_result)) {
echo'<div style="float:left; width:400px;">';
echo'<table width="100%">
<tr>
<td><strong>Name:</strong></td>
<td>'.$is_academic['employee'].'</td>
</tr>
<tr>
<td><strong>Entitlement:</strong></td>
<td>'.$is_academic['entitlement'].' '.$is_academic['units'].'</td>
</tr>
<tr>
<td><strong>Department / Division:</strong></td>
<td>'.$is_academic['division'].'</td>
</tr>
<tr>
<td><strong>Line Manager:</strong></td>
<td>'.$is_academic['line_manager'].'</td>
</tr>
</table>';
echo'<br/>';
echo'</div>';

echo'<table class="dataTable" id="academic_days_table" cellpadding="2" cellspacing="2" width="100%">
<thead>
<th>Start Date</th>
<th>End Date</th>
<th>'.$is_academic['units'].' to be taken</th>
<th>'.$is_academic['units'].' remaining</th>
<th></th>
</thead>';
echo '<tr>';
echo '<td>-</td>';
echo '<td>-</td>';
echo '<td>-</td>';
echo '<td>'.$is_academic['entitlement'].'</td>';
echo '<td></td>';
echo '</tr>';

$input = $is_academic['entitlement'];
}
else {echo 'You currently dont have a record for this academic year. ';}

//$requests_result = mysql_query('
//SELECT * 
//FROM holiday_entitlement_business_manual
//LEFT JOIN requests ON holiday_entitlement_business_manual.employee = requests.employee
//WHERE employee = ''' . $username . ''' AND academic_year = ''' . $acyear . ''' ');

$requests_result = mysql_query('SELECT * FROM requests WHERE employee = ''' . $username . ''' AND approved = 1 AND academic_year = ''' . $year . ''' ORDER BY start_date ASC');
$remainder = 0;
while($requests = mysql_fetch_array($requests_result)) {
$remainder = ($remainder == 0) ? $input : $remainder;
$out = $remainder - $requests['days'];
if($out < 0){
      break;
}
$remainder = $out;

echo'<tr>';
echo'<td>'.$requests['start_date'].'</td>';
echo'<td>'.$requests['end_date'].'</td>';
echo'<td>'.$requests['days'].'</td>';
echo'<td>'.$remainder.'</td>';
echo'<td><a href="?delete='.$requests['id'].'" class="delete"><img src="images/cross.png"></a></td>';
echo'</tr>';
}
echo'</table>';
?>

将脚本包含在xmlhttp.onreadystatechange=function()中

数据表现在已加载,$('a.delete').click(函数(e){}正在中工作

这里有一个例子:

 function showUser(str, username)
 {
 if (str=="")
   {
   document.getElementById("department_logs_txtHint").innerHTML="";
   return;
   } 
 if (window.XMLHttpRequest)
   {// code for IE7+, Firefox, Chrome, Opera, Safari
   xmlhttp=new XMLHttpRequest();
   }
 else
   {// code for IE6, IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
 xmlhttp.onreadystatechange=function()
   {
   if (xmlhttp.readyState==4 && xmlhttp.status==200)
     {           
     document.getElementById("department_logs_txtHint").innerHTML=xmlhttp.responseText;
     $('#business_days_table').dataTable({
        "iDisplayLength": 30,       
        "sDom": '<"clear">t>',
        "aaSortingFixed": [[0,'asc']],
        "aoColumns": [
            { "bSortable": false },
            { "bSortable": false },
            { "bSortable": false },
            { "bSortable": false },
            { "bSortable": false }
            ]
     });    
     $('#academic_days_table').dataTable({
        "iDisplayLength": 30,       
        "sDom": '<"clear">t>',
        "aaSortingFixed": [[0,'asc']],
        "aoColumns": [
            { "bSortable": false },
            { "bSortable": false },
            { "bSortable": false },
            { "bSortable": false },
            { "bSortable": false }
            ]
     });
  $('a.delete').click(function(e) {
    e.preventDefault();
    var parent = $(this).parent();
    $.ajax({
      type: 'get',
      url: 'getuser.php',
      data: 'ajax=1&delete=' + parent.attr('id').replace('record-',''),
      beforeSend: function() {
        parent.animate({'backgroundColor':'#fb6c6c'},300);
      },
      success: function() {
        parent.slideUp(300,function() {
          parent.remove();
        });
      }
    });
  });
     }
   }
 xmlhttp.open("GET","getuser.php?username="+username+"&year="+str,true);
 xmlhttp.send();
 }