Populating data into table using JQuery, Ajax and PHP

Question

I want to populate a database result in an HTML table. When the <a class="editUsers"> is clicked a box should pop up to show data from an Ajax call.

This should be shown:

<table id="userInfo">
    <tr>
        <thead>
            <td>User</td>
            <td>Mail</td>
            <td>Admin Access</td>
        </thead>
    </tr>
    <tr>
        <td>Jane Doe</td>
        <td>[email protected]</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>';
  }
?>

For starters, ("#userInfo").html(response); is missing a $. Should be $("#userInfo").html(response); — Paul Roub
– Paul Roub, Commented Oct 21, 2015 at 16:08
Wow. I could hit myself with a brick right now. I looked at that code for like 30 minutes and didn't find that silly mistake. Everything works now. Thanks :) — nTuply
– nTuply, Commented Oct 21, 2015 at 16:10
May this helps you: stackoverflow.com/questions/30770664/… — Alexander Ceballos
– Alexander Ceballos, Commented Oct 21, 2015 at 16:12

nTuply · Accepted Answer · 2015-10-21 16:18:57Z

1

Problem was fixed. I did a silly mistake and forgot to include a $. Thanks to Paul Roub for the answer, I quote:

For starters, ("#userInfo").html(response); is missing a $. Should be $("#userInfo").html(response); – Paul Roub 8 mins ago

answered Oct 21, 2015 at 16:18

nTuply

1,37423 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Populating data into table using JQuery, Ajax and PHP

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related