jquery 表分拣机问题

Question

你好，我昨天在这里得到了一些帮助，因为我遇到了 tablesorter 的问题。 如果我自己运行后端查询，它会显示结果正常。 但我从下拉列表中的另一个页面调用它，它显示所有记录，并且在 firebug 中没有看到任何错误。 我哪里错了？ 谢谢

此代码独立工作。

getuserlog.php

<?php
$q=$_GET["q"];

$con = mysql_connect('localhost', 'root', '');
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }

mysql_select_db("sample", $con);

$sql="SELECT * FROM logger_log WHERE idusr_log = '".$q."' order by datein_log desc";

$result = mysql_query($sql);

echo "<table id=\"userlog\" class=\"tablesorter\" cellspacing=\"1\">
<thead>
<tr>
<th align=\"left\">Ip Address</th>
<th align=\"left\">Date In</th>
<th align=\"left\">Date Out</th>
</tr>
</thead>";
    echo "<tbody>";
while($row = mysql_fetch_array($result))
  {

  echo "<tr>";
  echo "<td>" . $row['ip_log'] . "</td>";
  echo "<td>" . date('d/m/Y H:i:s',strtotime($row['datein_log'])) . "</td>";
  echo "<td>" . date('d/m/Y H:i:s',strtotime($row['dateout_log'])) . "</td>";
  echo "</tr>";

  }
   echo"</tbody>";
echo "</table>";


mysql_close($con);
?>
<div id="pager" class="pager">
    <form>
        <img src="css/blue/first.png" class="first"/>
        <img src="css/blue/prev.png" class="prev"/>
        <input type="text" class="pagedisplay"/>
        <img src="css/blue/next.png" class="next"/>
        <img src="css/blue/last.png" class="last"/>
        <select class="pagesize">
            <option selected="selected"  value="10">10</option>
            <option value="20">20</option>
            <option value="30">30</option>
            <option  value="40">40</option>
        </select>
    </form>
</div>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery.tablesorter.min.js"></script>
<script type="text/javascript" src="js/jquery.tablesorter.pager.js"></script>
<link href="css/blue/style.css" rel="stylesheet" type="text/css" />
        <script>
        $(function() {
        $("#userlog")
            .tablesorter({widthFixed: true, widgets: ['zebra']})
            .tablesorterPager({container: $("#pager")});
    });

        </script>

这是我从中调用它的页面。

用户日志.php

<script type="text/javascript">
function showUser(str)
{
if (str=="")
  {
  document.getElementById("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("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","getuserlog.php?q="+str,true);
xmlhttp.send();
}
</script>

<div class="spacer"></div>
<div class="userlogTxt">This report shows all users who have logged in up until: <?php echo date("d/m/Y H:i:s"); ?></div>
        <br />
        <?php
            $conn = mysql_connect('localhost', 'root', '') or die(mysql_error());

            mysql_select_db("sample") or die(mysql_error());

            $result2 = mysql_query('SELECT * FROM user_usr ORDER BY name_usr ASC', $conn);
            echo '<select name="users" onchange="showUser(this.value)">';
            echo '<option value="selected">'. 'Select a user' . '</option>';
            while ($row = mysql_fetch_assoc($result2))
            {

            echo '<option value="'.$row['id_usr'].'">'.$row['name_usr'].'</option>';
            }
            echo '</select>';
        ?>
    <br /><br />
<div id="txtHint" class="userlogTxt">Logging information will be shown here.</div></div>

@inti

它没有从数据库中提取任何日期。 只显示 header 和寻呼机。

用户日志.php

<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery.tablesorter.min.js"></script>
<script type="text/javascript" src="js/jquery.tablesorter.pager.js"></script> 
<link href="css/blue/style.css" rel="stylesheet" type="text/css" /> 
<script type="text/javascript">     
    function showUser(str)     
        {  
            $.get("getuserlog.php?q="+str,function(response) {
                $("#txtHint").html(response);
            // Tablesorter will run, just after you loaded the ajax response             
            $("#userlog").tablesorter({widthFixed: true, widgets: ['zebra']})
            .tablesorterPager({container: $("#pager")
            });         
                });     
        }
</script> 

<div class="spacer"></div>
<div class="userlogTxt">This report shows all users who have logged in up until: <?php echo date("d/m/Y H:i:s"); ?></div>
        <br />
        <?php
            $conn = mysql_connect('localhost', 'root', '') or die(mysql_error());

            mysql_select_db("sample") or die(mysql_error());

            $result2 = mysql_query('SELECT * FROM user_usr ORDER BY name_usr ASC', $conn);
            echo '<select name="users" onchange="showUser(this.value)">';
            echo '<option value="selected">'. 'Select a user' . '</option>';
            while ($row = mysql_fetch_assoc($result2))
            {

            echo '<option value="'.$row['id_usr'].'">'.$row['name_usr'].'</option>';
            }
            echo '</select>';
        ?>
    <br /><br />
<div id="txtHint" class="userlogTxt">Logging information will be shown here.</div></div>

getuserlog.php

<?php
$q=$_GET["q"];

$con = mysql_connect('localhost', 'root', '');
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }

mysql_select_db("sample", $con);

$sql="SELECT * FROM logger_log WHERE idusr_log = '".$q."' order by datein_log desc";

$result = mysql_query($sql);

echo "<table id=\"userlog\" class=\"tablesorter\" cellspacing=\"1\">
<thead>
<tr>
<th align=\"left\">Ip Address</th>
<th align=\"left\">Date In</th>
<th align=\"left\">Date Out</th>
</tr>
</thead>";
    echo "<tbody>";
while($row = mysql_fetch_array($result))
  {

  echo "<tr>";
  echo "<td>" . $row['ip_log'] . "</td>";
  echo "<td>" . date('d/m/Y H:i:s',strtotime($row['datein_log'])) . "</td>";
  echo "<td>" . date('d/m/Y H:i:s',strtotime($row['dateout_log'])) . "</td>";
  echo "</tr>";

  }
   echo"</tbody>";
echo "</table>";


mysql_close($con);
?>
<div id="pager" class="pager">
    <form>
        <img src="css/blue/first.png" class="first"/>
        <img src="css/blue/prev.png" class="prev"/>
        <input type="text" class="pagedisplay"/>
        <img src="css/blue/next.png" class="next"/>
        <img src="css/blue/last.png" class="last"/>
        <select class="pagesize">
            <option selected="selected"  value="10">10</option>
            <option value="20">20</option>
            <option value="30">30</option>
            <option  value="40">40</option>
        </select>
    </form>
</div>

我哪里出错了？ 谢谢

Answer 1

I recommend you, to use the jQuery Ajax functions in userlog.php , and since the script inside getuserlog.php is constant, move it to the userlog.php , something like this:

<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery.tablesorter.min.js"></script>
<script type="text/javascript" src="js/jquery.tablesorter.pager.js"></script>
<link href="css/blue/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
    function showUser(str)
    {
        $.get("getuserlog.php?q="+str,function(response) {
            $("#txtHint").html(response);
            // Tablesorter will run, just after you loaded the ajax response
            $("#userlog").tablesorter({widthFixed: true, widgets: ['zebra']})
                         .tablesorterPager({container: $("#pager")});
        });
    }
</script>

编辑：把你所有的 javascript 放在主页上。 ajax 响应应该只包含您想从服务器获取的数据。