Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Timothy Johnson
22,480 Pointscheck in page
i'm building a checking page that pull information from database and renter in a table on the page. What i cant figure out is how to add a check box in the table , so when a row is check and submit button is clicked a pop up page with the selected row is shown. How can i do this
8 Answers
Timothy Johnson
22,480 Pointsa single submit button, can select more than one checkbox, right now im using the "onclick" js function
Jason Anello
Courses Plus Student 94,610 PointsDo you need help with the whole process or just how to get a checkbox in the row?
Can you post the html for one row of your table and also what do you want that row to look like in the popup? Will it all be in a table again and look the same way? Perhaps provide the markup you would like in the popup.
Can you explain more on what you want for the popup? Do you want this displayed in something like a modal dialog or a lightbox type overlay? what did you have in mind for that?
Timothy Johnson
22,480 Pointswould be nice to start over, open to a better point of view from another developer
Timothy Johnson
22,480 Points<?php
$host = "localhost";
$db_name = "students";
$username = "root";
$password = "";
try {
$con = new PDO("mysql:host={$host};dbname={$db_name}", $username, $password);
}catch(PDOException $exception){ //to handle connection error
echo "Connection error: " . $exception->getMessage();
}
?>
Timothy Johnson
22,480 Pointsdata.php
<?php
include 'dbConnect.php';
try {
// prepare query
$query = "select
firstname, lastname
from
users
where
id = ?";
$stmt = $con->prepare( $query );
// this is the first question mark above
$stmt->bindParam(1, $_REQUEST['id']);
// execute our query
$stmt->execute();
// store retrieved row to a variable
$row = $stmt->fetch(PDO::FETCH_ASSOC);
// values to fill up our table
$firstname = $row['firstname'];
$lastname = $row['lastname'];
//$id = $row['id'];
//$ = $row[''];
// the table
echo "<table>";
echo "<tr>";
echo "<th>Select: </th>";
echo "<th>Firstname: </th>";
echo "<th>Lastname: </th>";
//echo "<th></th>";
echo "</tr>";
echo "<tr>";
echo "<td><input type = 'checkbox'></td>";
echo "<td>{$firstname}</td>";
echo "<td>{$lastname}</td>";
//echo "<td></td>";
echo "</tr>";
echo "</table>";
}catch(PDOException $exception){
// to handle error
echo "Error: " . $exception->getMessage();
}
?>
Timothy Johnson
22,480 Pointsck_in.php
Timothy Johnson
22,480 Points<html>
<head>
<title></title>
<style>
body{
font-family:arial,sans-serif;
}
select{
margin:0 0 10px 0;
padding:10px;
}
td,th {
background-color:#e8edff;
padding: 10px;
}
</style>
</head>
<body>
<form action= 'post' method = ''>
<input type = 'submit' value = 'Select All' name = 'selectAll'>
</form>
<?php
// connect to database
include "dbConnect.php";
// retrieve list of users and put it in the select box
$query = "SELECT id, firstname, lastname FROM users";
$stmt = $con->prepare( $query );
$stmt->execute();
//this is how to get number of rows returned
$num = $stmt->rowCount();
// make sure there are records on the database
if($num > 0){
// this will create selec box / dropdown list with user records
echo "<select id='users'>";
// make a default selection
echo "<option value='0'>Select a Student...</option>";
while ($row = $stmt->fetch(PDO::FETCH_ASSOC)){
extract($row);
echo "<option value='{$id}'>{$firstname} {$lastname}</option>";
}
echo "</select>";
}
// if no user records
else{
echo "<div>No records found</div>";
}
// this is where the related info will be loaded
echo "<div id='userInfo'>";
// retrieve list of users and put it in the select box
$q = "SELECT firstname, lastname FROM users";
$stmt = $con->prepare( $q );
$stmt->execute();
//this is how to get number of rows returned
$num = $stmt->rowCount();
// make sure there are records on the database
if($num > 0){
echo "<table>";
echo "<tr>";
echo "<th>Select: </th>";
echo "<th>Firstname: </th>";
echo "<th>Lastname: </th>";
//echo "<th></th>";
echo "</tr>";
echo "</table>";
while ($row = $stmt->fetch(PDO::FETCH_ASSOC)){
// values to fill up our table
$firstname = $row['firstname'];
$lastname = $row['lastname'];
//$id = $row['id'];
//$ = $row[''];
// the table
echo "<table>";
echo "<tr>";
echo "<td><input type = 'checkbox'></td>";
echo "<td>{$firstname}</td>";
echo "<td>{$lastname}</td>";
//echo "<td></td>";
echo "</tr>";
echo "</table>";
}
}
// if no user records
else{
echo "<div>No records found</div>";
}
echo "</div>";
?>
<input type = "submit" name = "submit" onclick='window.open("gsu/index.php","","width=500, height=250");'>
<input type = "submit" name = "back" value = "back">
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script>
$(document).ready(function(){
$("#users").change(function(){
// get the selected user's id
var id = $(this).find(":selected").val();
// load it in the userInfo div above
$('#userInfo').load('data.php?id=' + id);
});
});
</script>
</body>
</html>
Jason Anello
Courses Plus Student 94,610 PointsOk, it looks like what you're trying to do is take the selected table row data and post it to a php script ("gsu/index.php")?
If so, I found a stackoverflow questions that you can try adapting to your code. The top answer also has a jsfiddle demo with it so you can try it and see if that's what you think you need. It stops short of posting the data to php but uses an alert instead to show the data.
http://stackoverflow.com/questions/11910529/submitting-an-html-table-row-to-php
Timothy Johnson
22,480 Pointsis it possible to use session to carry over the checked data to the new page ?
Jason Anello
Courses Plus Student 94,610 PointsUnfortunately, I don't know. That's getting beyond my current level of php knowledge.
Does the situation in the stackoverflow link not accurately represent what you're trying to do?
I can continue trying to help you here if you think the stackoverflow link is heading in the right direction.
Otherwise, you might want to consider posting a new question but try to better formulate what it is that you need done.
For instance, I'm still not sure what you're trying to do with the checked rows if it's not like the stackoverflow link.
It looked to me like you are trying to submit the data to "gsu/index.php" but maybe that's not the case.
Jason Anello
Courses Plus Student 94,610 PointsI think that you wanted the date to be sent to "gsu/index.php" and for it to appear in a javascript popup.
If you're going to do a new post, perhaps describe better what that part is about. What is that php script doing with the data and are you supposed to stay on the page with the checked rows but the results from "gsu/index.php" should appear in a popup window?
Jason Anello
Courses Plus Student 94,610 PointsCan't edit comments properly.
date should be data
Jason Anello
Courses Plus Student 94,610 PointsJason Anello
Courses Plus Student 94,610 PointsSo on the page there's going to be several rows of data that came from the database and each row has it's own checkbox? Is there a single submit button? Can you check more than one checkbox and all of those rows would be displayed in the popup?
Once the table is displayed is the rest of the process you describe all happening client side? i.e. No data is getting sent back to the server
Can you post the php code that's generating your table or at least a sample of the html produced?
What are you using so far on your site in terms of frameworks and js libraries because you're going to need something that can give you some kind of popup.