How to use CSS to style the results of a PHP echo? - php

I am creating a search form for a packaging database and I have used CSS to style the HTML form that calls to the PHP page. I want to be able to style all the results from the PHP page using the same kind of CSS that styles the search form, as the PHP continues to echo the results as separate elements I want all of them to be displayed in separate little boxes. Is it as simple as I think it is e.g. just surrounding the PHP with tags? As I am trying that currently but it doesn't seem to work.
<body>
<?php
$con = mysql_connect ("localhost", "root", "");
mysql_select_db ("delyn_db", $con);
if (!$con)
{
die ("Could not connect: " . mysql_error());
}
$descrip = mysql_real_escape_string($_POST['descrip']);
$depth = mysql_real_escape_string($_POST['depth']);
$varWidth = mysql_real_escape_string($_POST['traywidth']);
$varHeight= mysql_real_escape_string($_POST['trayheight']);
$varRange = mysql_real_escape_string($_POST['trayrange']);
$varType = mysql_real_escape_string($_POST['traytype']);
$varShape = mysql_real_escape_string($_POST['trayshape']);
$varImage = mysql_real_escape_string($_POST['imagename']);
if (isset($varHeight) && !empty($varHeight)) {
$low = ($varHeight."00");
$high = ($varHeight."99");
} else {
$low = ("000");
$high = ("999");
}
if (isset($varWidth) && !empty($varWidth)) {
$min = ($varWidth."00");
$max = ($varWidth."99");
} else {
$min = ("000");
$max = ("999");
}
$sql = "SELECT * FROM delyn WHERE
description LIKE '%".$descrip."%'
AND trayrange LIKE '%".$varRange."%'
AND traytype LIKE '%".$varType."%'
AND trayshape LIKE '%".$varShape."%'
AND traywidth BETWEEN '".$min."' AND '".$max."'
AND trayheight BETWEEN '".$low."' AND '".$high."' ";
?>
while ($row = mysql_fetch_array($r_query))
{
echo '<p class="results">';
echo '<br /><img src=" '. $row['imagename'] . '" width="120" length="50">';
echo '<br /><strong> Tool Code: </strong> '. $row['toolcode'];
echo '<br /><strong> Description: </strong> '. $row['description'];
echo '<br /><strong> Tray range: </strong> '. $row['trayrange'];
echo '<br /><strong> Tray type: </strong> '. $row['traytype'];
echo '<br /><strong> Tray size: </strong> '. $row['traysize'];
echo '<br /><strong> Tray shape: </strong> '. $row['trayshape'] . '<br />' . '<br />' . '</p>';;
}
if (mysql_num_rows($r_query) <= 0){
echo 'No results match your search, please try again';
}
?>
</body>
CSS (For the HTML form, I want the same attributes for the Form div tag to work for the results):
#charset "UTF-8";
/* CSS Document */
body {
}
.results {
width: 190px;
padding: 10px;
background: #E8CF24;
overflow:auto;
display:block;
font-family: Verdana, Geneva, sans-serif;
font-size: 11px;
border: 1px solid #cccccc;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;
-moz-box-shadow: 2px 2px 2px #cccccc;
-webkit-box-shadow: 2px 2px 2px #cccccc;
box-shadow: 2px 2px 2px #cccccc;
}
Now EDITED.

Instead of using breaks use paragraph tags.
<p><?php echo $row['imagename']; ?></p>
For example. Then you can assign classes to the paragraph tags.
So if you want to assign a class for each part just have:
<p class="image_name_class"><?php echo $row['imagename']; ?></p>
<p class="tool_code_class"><?php echo $row['toolcode']; ?></p>
Or in a form:
<label class="control-label" for="input01">Tool Code</label>
<input class="input" ID="tool_code" runat="server"><?php echo $row['toolcode']; ?></input >
Though where you have .input in that CSS you can just have input rather than .input that way you don't have to assign a class to your inputs it will be automatically.

Related

Any idea how to stop paragraph from going over its div?

I'm currently trying to make a blog. When I try to make a "preview" of the body of the post. The first post seems to be fine, but the second post goes over its div. I tried changing what tags to use and css formatting but it stays like that.
My code:
HTML
<div class="module">
<div class="blog">
<div class="recents">
<h2>Recent Posts</h2>
<br><br>
<?php
$sql = "select title, body, created_at FROM posts";
$result = mysqli_query($link, $sql);
$query = mysqli_query($link, $sql) or die(mysqli_error($link));
while ($row = mysqli_fetch_assoc($query)) {
$title = $row['title'];
$body = $row['body'];
$created_at = $row['created_at'];
if (strlen($body) > 500) {
$body = substr($body, 0, 500);
}
echo "<h3>" . $title . "</h3><br>";
echo "<p>" . $body . "</p>";
echo "<small>" . $created_at . "</small>";
echo "<br><br>";
}
?>
</div>
<div class="categories">
<h3>Categories</h3>
</div>
</div>
CSS
html {
font-family: 'IBM Plex Serif', serif;
}
.module {
background-color: #fffff7;
box-shadow: 3px 10px 18px #888888;
padding-top: 70px;
padding-left: 130px;
border: 1px solid;
width: 1080px;
margin-left: 380px;
height: 821px;
}
.blog {
display: flex;
flex-direction: row;
text-align: left;
}
.recents {
flex-grow: 2;
width: 570px;
}
.categories {
flex-grow: 1;
}
Any help would be appreciated.
It is because there are no spaces
to fix this try this:
word-wrap: break-word;

Allowing spaces in text input

I've created a PHP blog system. Here's what the 'create a post feature' looks like
Here's the code for it:
<?php
session_start();
include('db_connect.php');
if(!isset($_SESSION['user_id'])){
header('Location: login.php');
exit();
}
if(isset($_POST['submit'])){
$title = $_POST['title'];
$body = $_POST['body'];
$category = $_POST['category'];
$title = $db->real_escape_string($title);
$body = $db->real_escape_string($body);
$user_id = $_SESSION['user_id'];
$date = date('Y-m-d G:i:s');
$body = htmlentities($body);
if($title && $body && $category){
$query = $db->query("INSERT INTO posts (user_id, title, body, category_id, posted) VALUES('$user_id', '$title', '$body', '$category', '$date')");
if($query){
echo '<div style="position:absolute; bottom: 40px; left: 500px; padding: 10px; background: red; box-shadow: 0px 3px 12px 2px #000; color: #fff;">Post Added</div>';
}else{
echo '<div style="position:absolute; bottom: 40px; left: 500px; padding: 10px; background: red; box-shadow: 0px 3px 12px 2px #000; color: #fff;">An unexpected error has occured.</div>';
}
}else{
echo '<div style="position:absolute; bottom: 40px; left: 500px; padding: 10px; background: red; box-shadow: 0px 3px 12px 2px #000; color: #fff;">Please enter all the required information to proceed</div>';
}
}
?>
<div id="mainbox">
<form action="<?php echo $_SERVER['PHP_SELF']?>" method="post">
<input type="text" name="title" placeholder="Enter Post Title Here">
<p></p>
<textarea name="body" cols=50 rows=10 placeholder="Enter Post Content Here"></textarea>
<p></p>
<select name="category">
<?php
$query = $db->query("SELECT * FROM categories");
while($row = $query->fetch_object()){
echo "<option value='".$row->category_id."'>".$row->category."</option>";
}
?>
</select>
<p></p>
<input type="submit" name="submit" value="Submit">
</form>
</div>
When I click submit hover and the post is created, it turns out like this:
As you can see, the paragraphs I added in have been removed. How do I prevent this and keep the paragraphs?
The way the data is entered is with new line characters. When this is pasted in an HTML page though, they are not visible because whitespace is collapsed in HTML. To keep the line breaks, convert them to HTML with nl2br().
Note that it is better to convert the data each time you print it out, not store it in the database with <br> tags. Otherwise if you go to edit the post, suddenly you're dealing with HTML and not plain text - not something users expect. Not only that, but you would be exposing yourself to security risks by allowing arbitrary HTML.
So on that example page, do something like this:
<?php
while($query->fetch()):
$html_body = nl2br($body);
$lastspace = strrpos($html_body, ' ');
?>
<h2><?php echo $title?></h2>
<p><?php echo substr($html_body, 0, $lastspace)."<a href='blog/post.php?id=$post_id'>..</a>"?></p>
<p>Category: <?php echo $category?>
<hr />
<p></p>
<?php endwhile?>
use htmlentities in php
or html pre tab
updated
echo "<pre>" . $postedData . "</pre>";
or
echo htmlentities($postedData);

How can I insert pagination in my search engine?

How can I insert pagination in my search engine search.php page?
If there is 1 page, I do not want the Previous button and the Next button.
If there are 2 pages and I am on the first page, I hope that I can have the Next button.
If there are 2 pages and I am on the second page, I also hope that I can only have the Previous button.
This is my current code, hope that you can help me:
<?php
//php code goes here
include 'connect.php'; // for database connection
include 'script_suggestion.php';
include 'script_close_suggestion_box.php';
$query = $_GET['q']; // query
$button = $_GET ['submit'];
$page_number = $_GET['page'];
if (!$page_number);
$page_number = 0;
$results_per_page = 10;
$next = $page_number + $results_per_page;
$prev = $page_number - $results_per_page;
?>
<html>
<head>
<title>
Brandon's Search Engine
</title>
<style type="text/css">
#title a {
font-size: 17pt;
margin: 5px;
padding: 2px;
border-color: black;
text-decoration: underline;
width: 544px;
}
#search-result {
display: block;
border: 1px solid grey;
border-color: grey;
}
#search-result:hover {
background-color: #dddddd;
width: 544px;
}
#link {
font-size: 17pt;
margin: 5px;
padding: 2px;
width: 544px;
}
#description {
font-size: 17pt;
margin: 5px;
padding: 2px;
width: 544px;
}
#search-page-number {
display: block;
width: auto;
height: auto;
border: 1px solid gray;
margin: 2px;
padding-left: 5px;
padding-right: 5px;
padding-bottom: 2px;
padding-top: 2px;
list-style: none;
float: left;
text-align: center;
}
#search-page-number:hover {
background-color: #dddddd;
}
#suggestion {
border: 1px solid black;
visibility: hidden;
position: fixed;
background-color: white;
z-index: 10;
}
#suggestion a {
font-size: 12pt;
color: black;
text-decoration: none;
display: block;
width: 548px;
height: auto;
text-align: left;
padding: 2px;
}
#suggestion a:hover {
background-color: #dddddd;
width: 544px;
padding: 2px;
}
</style>
</head>
<body>
<form method="GET" action="search.php">
<table>
<tr>
<td>
<h2>
Brandon's Search Engine
</h2>
</td>
</tr>
<tr>
<td>
<input type="text" value="<?php echo htmlspecialchars($_GET['q']); ?>" name="q" style="height: 27px; width: 550px; padding: 2px" name="q"
onkeyup="getSuggestion(this.value)" autocomplete="off" onblur="closeBox()" placeholder="Search Now"/>
<input type="submit" value="Search" name="submit" style="height: auto; width: 60px; padding: 2px" />
<div id="suggestion" style="width: 548px">
</div>
</td>
</tr>
</table>
<br>
<hr>
<table>
<tr>
<td>
<?php
//SQL query
$stmt = "SELECT * FROM searchengine WHERE title LIKE '%" . mysqli_real_escape_string($con,$query) . "%' OR keywords LIKE '%" . mysqli_real_escape_string($con,$query) . "%' OR link LIKE '%" . mysqli_real_escape_string($con,$query) . "%' LIMIT " . $page_number . " , $results_per_page";
$result = mysqli_query($con,$stmt) or die(mysqli_error($con));
$number_of_result = mysqli_num_rows($result);
$x++;
if($x==1)
if ($number_of_result < 1) {
echo "<b>No results found!</b>";
echo "<p>";
echo "Your search - <b>$query</b>" . " - did not match any documents. Please try different keywords.";
} elseif ($number_of_result > 1) {
echo "<b>$number_of_result results found!</b>";
echo "<p>";
//results found here and display them
$index = 1;
while (($row = \mysqli_fetch_assoc($result)) && ($index < 10)) {//10 results per page
$title = $row["title"];
$description = $row["description"];
$link = $row["link"];
echo "<div id='search-result'>";
echo "<div id='title'><a href='$link'>" . $title . "</a></div>";
//echo "<br />";
echo "<div id='link'><small>" . $link . "</small></div>";
//echo "<p>";
echo "<div id='description'><small>" . $description . "</small></div>";
echo "</div>";
echo "<br />";
$index++;
}
} elseif ($number_of_result = 1) {
echo "<b>$number_of_result result found!</b>";
echo "<p>";
//results found here and display them
$index = 1;
while (($row = \mysqli_fetch_assoc($result)) && ($index < 10)) {//10 results per page
$title = $row["title"];
$description = $row["description"];
$link = $row["link"];
echo "<div id='search-result'>";
echo "<div id='title'><a href='$link'>" . $title . "</a></div>";
//echo "<br />";
echo "<div id='link'><small>" . $link . "</small></div>";
echo "<br />";
echo "<div id='description'><small>" . $description . "</small></div>";
echo "</div>";
echo "<br />";
$index++;
}
}
?>
</td>
</tr>
<tr>
<td>
<input type="hidden" name="page" value="<?php echo 1; ?>" />
<div id="page-number">
Select Page Number:
<?php
//ie if 35 results are therer then we require 4 pages that are 0 to max_page_number
//current page number is equal to page_number
$max_page_number = $number_of_result / 10;
//echo $max_page_number;
echo "<ul>";
//both the condition are not the neccesary
if(!$page_number <= 0)
{
//print the link to previous page
echo "<li id='search-page-number'>";
echo "Previous";
echo "</li>";
}
$i = 1;
for($index = 0; $index < $number_of_result; $index=$index+$results_per_page)
{
echo "<li id='search-page-number'>";
echo "<a href=search.php?q=$query&page=$i>";
echo $i++ . "</a>";
echo "</li>";
}
if($page_number < $number_of_result - $results_per_page)
{
//print the link to next page
echo "<li id='search-page-number'>";
echo "Next";
echo "</li>";
}
echo "</ul>";
?>
</div>
</td>
</tr>
<tr>
<td align="center">
To insert your site in result fill in the form at here.
</td>
</tr>
</table>
</form>
</body>
</html>
Thanks in advance.
<?php
//php code goes here
include 'connect.php'; // for database connection
include 'script_suggestion.php';
include 'script_close_suggestion_box.php';
$query = $_GET['q']; // query
$button = $_GET ['submit'];
$page_number = (int)$_GET['page'];
if (!$page_number)
$page_number = 0;
$results_per_page = 10;
$next = $page_number + $results_per_page;
$prev = $page_number - $results_per_page;
?>
<html>
<head>
<title>
Brandon's Search Engine
</title>
<style type="text/css">
#title a {
font-size: 17pt;
margin: 5px;
padding: 2px;
border-color: black;
text-decoration: underline;
width: 544px;
}
#search-result {
display: block;
border: 1px solid grey;
border-color: grey;
}
#search-result:hover {
background-color: #dddddd;
width: 544px;
}
#link {
font-size: 17pt;
margin: 5px;
padding: 2px;
width: 544px;
}
#description {
font-size: 17pt;
margin: 5px;
padding: 2px;
width: 544px;
}
#search-page-number {
display: block;
width: auto;
height: auto;
border: 1px solid gray;
margin: 2px;
padding-left: 5px;
padding-right: 5px;
padding-bottom: 2px;
padding-top: 2px;
list-style: none;
float: left;
text-align: center;
}
#search-page-number:hover {
background-color: #dddddd;
}
#suggestion {
border: 1px solid black;
visibility: hidden;
position: fixed;
background-color: white;
z-index: 10;
}
#suggestion a {
font-size: 12pt;
color: black;
text-decoration: none;
display: block;
width: 548px;
height: auto;
text-align: left;
padding: 2px;
}
#suggestion a:hover {
background-color: #dddddd;
width: 544px;
padding: 2px;
}
</style>
</head>
<body>
<form method="GET" action="search.php">
<table>
<tr>
<td>
<h2>
Brandon's Search Engine
</h2>
</td>
</tr>
<tr>
<td>
<input type="text" value="<?php echo htmlspecialchars($_GET['q']); ?>" name="q" style="height: 27px; width: 550px; padding: 2px" name="q"
onkeyup="getSuggestion(this.value)" autocomplete="off" onblur="closeBox()" placeholder="Search Now"/>
<input type="submit" value="Search" name="submit" style="height: auto; width: 60px; padding: 2px" />
<div id="suggestion" style="width: 548px">
</div>
</td>
</tr>
</table>
<br>
<hr>
<table>
<tr>
<td>
<?php
//count
$count_sql = "SELECT count(*) as c FROM searchengine WHERE title LIKE '%" . mysqli_real_escape_string($con,$query) . "%' OR keywords LIKE '%" . mysqli_real_escape_string($con,$query) . "%' OR link LIKE '%" . mysqli_real_escape_string($con,$query) . "%' ";
$search_count = mysqli_fetch_array(mysqli_query($con,$count_sql));
$number_of_result = $search_count['c'];
//SQL query
$stmt = "SELECT * FROM searchengine WHERE title LIKE '%" . mysqli_real_escape_string($con,$query) . "%' OR keywords LIKE '%" . mysqli_real_escape_string($con,$query) . "%' OR link LIKE '%" . mysqli_real_escape_string($con,$query) . "%' LIMIT " . $page_number . " , $results_per_page";
$result = mysqli_query($con,$stmt) or die(mysqli_error($con));
//$number_of_result = mysqli_num_rows($result);
$x++;
if($x==1)
if ($number_of_result < 1) {
echo "<b>No results found!</b>";
echo "<p>";
echo "Your search - <b>$query</b>" . " - did not match any documents. Please try different keywords.";
} elseif ($number_of_result > 1) {
echo "<b>$number_of_result results found!</b>";
echo "<p>";
//results found here and display them
$index = 1;
while (($row = \mysqli_fetch_assoc($result)) && ($index < 10)) {//10 results per page
$title = $row["title"];
$description = $row["description"];
$link = $row["link"];
echo "<div id='search-result'>";
echo "<div id='title'><a href='$link'>" . $title . "</a></div>";
//echo "<br />";
echo "<div id='link'><small>" . $link . "</small></div>";
//echo "<p>";
echo "<div id='description'><small>" . $description . "</small></div>";
echo "</div>";
echo "<br />";
$index++;
}
} elseif ($number_of_result == 1) {
echo "<b>$number_of_result result found!</b>";
echo "<p>";
//results found here and display them
$index = 1;
while (($row = \mysqli_fetch_assoc($result)) && ($index < 10)) {//10 results per page
$title = $row["title"];
$description = $row["description"];
$link = $row["link"];
echo "<div id='search-result'>";
echo "<div id='title'><a href='$link'>" . $title . "</a></div>";
//echo "<br />";
echo "<div id='link'><small>" . $link . "</small></div>";
echo "<br />";
echo "<div id='description'><small>" . $description . "</small></div>";
echo "</div>";
echo "<br />";
$index++;
}
}
?>
</td>
</tr>
<tr>
<td>
<input type="hidden" name="page" value="0" />
<div id="page-number">
Select Page Number:
<?php
//ie if 35 results are therer then we require 4 pages that are 0 to max_page_number
//current page number is equal to page_number
$max_page_number = ceil($number_of_result / $results_per_page);
//echo $max_page_number;
echo "<ul>";
//both the condition are not the neccesary
if ($max_page_number > 2) { // if more than 2 pages
if ($page_number > 0 ) { //Previous
echo "<li id='search-page-number'>";
echo "Previous";
echo "</li>";
}
for($index = 0 ; $index < $max_page_number ; $index++)
{
echo "<li id='search-page-number'>";
echo "<a href=search.php?q=$query&page=".($index * $results_per_page).">";
echo ($index + 1) . "</a>";
echo "</li>";
}
if (($page_number + $results_per_page) < $number_of_result ) { //Next
echo "<li id='search-page-number'>";
echo "Next";
echo "</li>";
}
} elseif (($max_page_number == 2 ) ) {
echo "<li id='search-page-number'>";
echo "".($page_number == 0 ? "Next":"Previous" )."";
echo "</li>";
} elseif (($max_page_number == 1 ) ) {
echo "<li id='search-page-number'>";
echo "<a href=search.php?q=$query&page=0>1</a>";
echo "</li>";
}
echo "</ul>";
?>
</div>
</td>
</tr>
<tr>
<td align="center">
To insert your site in result fill in the form at here.
</td>
</tr>
</table>
</form>
</body>
</html>

Styling multiple while loop results, getting them next to each other?

I have a search form the searches through a packaging database. Everything works fine and dandy, when the search from is submitted I get returned results on a different page displayed in styled boxes with a picture. But unfortunately the seem to display one after another underneath each other. Although it is good that they are returning and I am getting the correct results. I want to be able to display three next to each other, then they go to the next row and display three more, so on and so forth until I have run out of results.
Here is the PHP:
<?php
$con = mysql_connect ("localhost", "horizon1", "D2j616H5O#Lw");
mysql_select_db ("horizon1_delyn", $con);
if (!$con)
{
die ("Could not connect: " . mysql_error());
}
$descrip = mysql_real_escape_string($_POST['descrip']);
$depth = mysql_real_escape_string($_POST['depth']);
$varWidth = mysql_real_escape_string($_POST['traywidth']);
$varHeight= mysql_real_escape_string($_POST['trayheight']);
$varRange = mysql_real_escape_string($_POST['trayrange']);
$varType = mysql_real_escape_string($_POST['traytype']);
$varShape = mysql_real_escape_string($_POST['trayshape']);
$varImage = mysql_real_escape_string($_POST['imagename']);
if (isset($varHeight) && !empty($varHeight)) {
$low = ($varHeight."00");
$high = ($varHeight."99");
} else {
$low = ("000");
$high = ("999");
}
if (isset($varWidth) && !empty($varWidth)) {
$min = ($varWidth."00");
$max = ($varWidth."99");
} else {
$min = ("000");
$max = ("999");
}
$sql = "SELECT * FROM range WHERE
description LIKE '%".$descrip."%'
AND trayrange LIKE '%".$varRange."%'
AND traytype LIKE '%".$varType."%'
AND trayshape LIKE '%".$varShape."%'
AND traywidth BETWEEN '".$min."' AND '".$max."'
AND trayheight BETWEEN '".$low."' AND '".$high."' ";
$r_query = mysql_query($sql);
while ($row = mysql_fetch_array($r_query))
{
echo '<div id="results">';
echo '<p class="image">
<img src=" '. $row['imagename'] . '" width="150" length="80">
</p>';
echo '<div id="table"><br />
<strong> Tool Code: </strong> '. $row['toolcode'];
echo '<br /><strong> Description: </strong> '. $row['description'];
echo '<br /><strong> Tray range: </strong> '. $row['trayrange'];
echo '<br /><strong> Tray type: </strong> '. $row['traytype'];
echo '<br /><strong> Tray size: </strong> '. $row['traysize'];
echo '<br /><strong> Tray shape: </strong> '. $row['trayshape'] . '</div>' . '<br />';
echo 'Enquiry Page <br />' .
'Back to Search';
echo '</div>' . '<br />';
}
if (mysql_num_rows($r_query) <= 0){
echo 'No results match your search, please try again';
}
?>
And here is the CSS:
<style>
#boxes {
padding: 10px;
margin-top: 20px;
margin: 10px;
float: left;
display: block;
}
#results {
width: 212px;
padding: 5px;
background: #E8CF24;
display: block;
overflow:auto;
font-family: Verdana, Geneva, sans-serif;
font-size: 11px;
font-color: #FFF;
border: 2px solid #cccccc;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;
-moz-box-shadow: 2px 2px 2px #cccccc;
-webkit-box-shadow: 2px 2px 2px #cccccc;
box-shadow: 2px 2px 2px #cccccc;
}
#table {
margin-top: 10px;
width: 200px;
padding: 3px;
background: #FFF;
display: block;
overflow:auto;
border: 2px solid #cccccc;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;
-moz-box-shadow: 2px 2px 2px #cccccc;
-webkit-box-shadow: 2px 2px 2px #cccccc;
box-shadow: 2px 2px 2px #cccccc;
}
.image {
margin-left: 28px;
margin-bottom: 0px;
margin-top: 5px;
}
a:link {
color: #000423;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
}
</style>
I have tried to edit it with the CSS but I can change the position and padding, margins and so on forth. But I can't get them to align next to each other.
Anyone able to help? Thanks in advance :)
In your css add this to your #results selector.
#results {
float:left
}
EDIT: Sorry that was not the correct answer. Delete the above code and look into thee below code.
Replace the while loop with the below code.
EDIT: Dont forget to initialize the $count variable. ($count = 0;)
Just copy-paste the code and it should work for you.
$count = 0;
while ($row = mysql_fetch_array($r_query))
{
$t = $count%3;
echo ($t==2) ? '<div id="results">' : '<div id="results" style="float:left">';
echo '<p class="image">
<img src=" '. $row['imagename'] . '" width="150" length="80">
</p>';
echo '<div id="table"><br />
<strong> Tool Code: </strong> '. $row['toolcode'];
echo '<br /><strong> Description: </strong> '. $row['description'];
echo '<br /><strong> Tray range: </strong> '. $row['trayrange'];
echo '<br /><strong> Tray type: </strong> '. $row['traytype'];
echo '<br /><strong> Tray size: </strong> '. $row['traysize'];
echo '<br /><strong> Tray shape: </strong> '. $row['trayshape'] . '</div>' . '<br />';
echo 'Enquiry Page <br />' .
'Back to Search';
echo '</div>';
$count++;
}
This is what i get. I didnt use the css file.

jquery only returning last result of php while loop

The following code is only grabbing the value of the last result in the PHP while loop. Any / all help much-appreciated. Thanks!
PHP/HTML/JS:
<section id="info">
<?php
$user = $session->username;
$q = sprintf("SELECT * FROM mail WHERE UserTo = '%s' ORDER BY SentDate DESC",
mysql_real_escape_string($user));
$getMail = mysql_query($q, $link) or die(mysql_error());
if(mysql_num_rows($getMail) == 0) {
echo "<p>you have no mail</p>";
}
else {
?>
<form id="inbox" class="mail">
<fieldset>
<ul>
<li style="border: 2px solid purple; width: 100%;">
<span style="width: 8%; margin-left: 13%;">Status</span>
<span style="width: 15%;">From</span>
<span style="width: 45%;">Subject</span>
<span style="width: 16%;">Time</span>
</li>
<?php
while($mail = mysql_fetch_object($getMail)) {
$status = $mail->status;
$mailId = $mail->mail_id;
$from = $mail->UserFrom;
$subject = $mail->Subject;
$received = $mail->SentDate;
$theMessage = $mail->Message;
?>
<li class="outerDiv" style="border: 2px dotted purple;">
<button style="display: inline;" class="viewButton">View</button>
<button style="display: inline;">Delete</button>
<?php
echo "<span>" . $mail_id . "</span>";
echo "<span style="display: inline-block; width: 8%; border: 1px solid red;'>" . $status . "</span>";
echo "<span style='display: inline-block; width: 15%; border: 1px solid red;'>" . $from . "</span>";
echo "<span style='display: inline-block; width: 45%; border: 1px solid red;'>" . $subject . "</span>";
echo "<span style='display: inline-block; font-size: x-small; width: 17%; border: 1px solid red;'>" . $received . "</span>";
?>
</li>
<?php }
} ?>
</ul>
</fieldset>
</form>
</section>
<section id="details">
<div class="theMessage" style="display: none;"><?php echo $theMessage; ?></div>
<script type="text/javascript">
$(document).ready(function() {
$(".outerDiv").click(function(e) {
if($(e.target).is(".viewButton")) {
$(".theMessage").fadeIn(1000);
}
});
return false;
});
</script>
</section>
When you say "grabbing the value of the last result," I'm guessing you're talking about the following line?
<div class="theMessage" style="display: none;"><?php echo $theMessage; ?></div>
That's outside the while() loop, so yeah, $theMessage will just retain the last value from the loop.
Seeing as how you're starting the <form> within the else block but closing the </form> outside the else block, I'm guessing you're ending your while and if-else too early.
First of all you have a syntax error in your code.
Escape double quotes or use single quotes for HTML.
What javascript library are you using? Looks like it could be JQuery?
If you expect your selector to return an array, then you need to use an iterator to act on each element. Try the each iterator function: http://api.jquery.com/each/
$('.outerDiv').each(function() {
this.click( function(e) {....

Categories