【问题标题】:Populating data into table using JQuery, Ajax and PHP使用 JQuery、Ajax 和 PHP 将数据填充到表中
【发布时间】:2015-10-21 16:07:54
【问题描述】:

我想在 HTML 表中填充数据库结果。当点击<a class="editUsers"> 时,应该会弹出一个框来显示来自 Ajax 调用的数据。

应该显示:

<table id="userInfo">
    <tr>
        <thead>
            <td>User</td>
            <td>Mail</td>
            <td>Admin Access</td>
        </thead>
    </tr>
    <tr>
        <td>Jane Doe</td>
        <td>janedoe@islost.com</td>
        <td>Yes</td>
    </tr>
</table>        

$(".editUsers").click(function(){
    $("#userInfo").fadeIn(1000);
    $(".exitUsrMgmt").fadeIn(1000); //This is the close button for that popup

    $.ajax({    //create an ajax request to load_page.php
        type: "GET",
        url: "includes/getUserData.php",             
        dataType: "html",   //expect html to be returned                
        success: function(response){                   
            ("#userInfo").html(response);
        },
        error:function (xhr, ajaxOptions, thrownError){
            alert(thrownError);
        }
    });
}); 

<?php
  include_once('config.php');

  //Create PDO Object
  $con = new PDO( DB_DSN, DB_USERNAME, DB_PASSWORD );
  //Set Error Handling for PDO
  $con->setAttribute( PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION );
  //Query
  $sql = "SELECT name, email, admin FROM user_admin";

  //Prepare Statement
  $stmt = $con->prepare($sql);
  $stmt->execute();

  while ($row = $stmt->fetch()){
    echo '<tr>';
    echo    '<td>'.$row[0].'</td>';
    echo    '<td>'.$row[1].'</td>';
    echo    '<td>'.$row[2].'</td>';
    echo '</tr>';
  }
?>

【问题讨论】:

  • 对于初学者,("#userInfo").html(response); 缺少$。应该是$("#userInfo").html(response);
  • 哇。我现在可以用砖头打自己。我看了大约 30 分钟的代码,并没有发现那个愚蠢的错误。现在一切正常。谢谢:)
  • 希望对您有所帮助:stackoverflow.com/questions/30770664/…

标签: javascript php jquery ajax pdo


【解决方案1】:

问题已解决。我犯了一个愚蠢的错误,忘记包含$。感谢 Paul Roub 的回答,我引用:

对于初学者,("#userInfo").html(response); 缺少$。应该 $("#userInfo").html(response); – Paul Roub 8 分钟前

【讨论】:

    猜你喜欢
    • 2010-12-17
    • 2016-06-19
    • 2016-01-07
    • 2014-05-24
    • 1970-01-01
    • 2015-04-18
    • 2018-06-14
    • 1970-01-01
    • 2021-11-17
    相关资源
    最近更新 更多