nyius Posted March 10, 2013 Share Posted March 10, 2013 (edited) Hello! I'm brand new here, as well I am pretty much a nub at mySql and PhP scripting (with a decent amount of knowledge in HTML) and need help with this project Right now what my code does, is I pull in 2 images from random rows in my mySql database (using 2 separate recordsets) and display the images in their own tables. What I want to have done, is on the push of a button, both of the images swap out to another random image from my databse (note there will be somewhere between 1000-5000 image databse entries, so i can't pre-load images or anything) The php code i use (in a separate document that i include into my index document) to grab the random images from the databse is) ** there are 2 seperate documents like this one, and another one thats identical with the same name thta gets included into my index <?php require_once('Connections/RateItCelb.php'); ?> <?php if (!function_exists("GetSQLValueString")) { function GetSQLValueString($theValue, $theType, $theDefinedValue = "", $theNotDefinedValue = "") { if (PHP_VERSION < 6) { $theValue = get_magic_quotes_gpc() ? stripslashes($theValue) : $theValue; } $theValue = function_exists("mysql_real_escape_string") ? mysql_real_escape_string($theValue) : mysql_escape_string($theValue); switch ($theType) { case "text": $theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL"; break; case "long": case "int": $theValue = ($theValue != "") ? intval($theValue) : "NULL"; break; case "double": $theValue = ($theValue != "") ? doubleval($theValue) : "NULL"; break; case "date": $theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL"; break; case "defined": $theValue = ($theValue != "") ? $theDefinedValue : $theNotDefinedValue; break; } return $theValue; } } mysql_select_db($database_RateItCelb, $RateItCelb); $query_RedCeleb = "SELECT * FROM Celeb ORDER BY RAND() LIMIT 0,1"; $RedCeleb = mysql_query($query_RedCeleb, $RateItCelb) or die(mysql_error()); $row_RedCeleb = mysql_fetch_assoc($RedCeleb); $totalRows_RedCeleb = mysql_num_rows($RedCeleb); ?> and this is the code I use for my index page. Id like to load in random images WITHOUT a page refresh each time. the image codes are half way down and look like this <?php echo "<img src=\"". $row_BlueCeleb['url'] ."\" alt=\"\" />"; ?> **RedCeleb and BlueCeleb are both the recordsets to grab images, and RateItCeleb is the name of my databse <?php include('ImageLoad.php'); include('ImageLoad2.php'); ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <html> <head> <title>idea1</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <link href="names.css" rel="stylesheet" type="text/css" /> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onload="MM_preloadImages('images/canvas_26_down.jpg')"> <table id="Table_01" width="1351" height="801" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="18" bgcolor="#25262A"> <img src="images/appImages_01.gif" width="1350" height="99" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="99" alt=""></td> </tr> <tr> <td colspan="8"> <img src="images/appImages_02.gif" width="291" height="50" alt=""></td> <td colspan="10" rowspan="2" bgcolor="#25262A"> <img src="images/appImages_03.gif" width="1059" height="81" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="50" alt=""></td> </tr> <tr> <td colspan="8"> <img src="images/Popular.gif" width="291" height="31" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="31" alt=""></td> </tr> <tr> <td colspan="8"> <img src="images/Hated.gif" width="291" height="39" alt=""></td> <td rowspan="14"> <img src="images/appImages_06.gif" width="39" height="620" alt=""></td> <td colspan="2" bgcolor="#25262A"> <?php echo $row_BlueCeleb['name']; ?> </td> <td colspan="4" rowspan="7"> <img src="images/appImages_08.gif" width="224" height="381" alt=""></td> <td colspan="2" bgcolor="#25262A"><?php echo $row_RedCeleb['name']; ?></td> <td rowspan="14"> <img src="images/appImages_10.gif" width="75" height="620" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="39" alt=""></td> </tr> <tr> <td colspan="8"> <img src="images/appImages_11.gif" width="291" height="23" alt=""></td> <td colspan="2" rowspan="6" bgcolor="#25262A"> <?php echo "<img src=\"". $row_BlueCeleb['url'] ."\" alt=\"\" />"; ?> </td> <td colspan="2" rowspan="6" bgcolor="#25262A"> <?php echo "<img src=\"". $row_RedCeleb['url'] ."\" alt=\"\" />"; ?> </td> <td> <img src="images/spacer.gif" width="1" height="23" alt=""></td> </tr> <tr> <td colspan="7"> <img src="images/Browse.gif" width="265" height="36" alt=""></td> <td rowspan="12"> <img src="images/appImages_15.gif" width="26" height="558" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="36" alt=""></td> </tr> <tr> <td colspan="7"> <img src="images/appImages_16.gif" width="265" height="42" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="42" alt=""></td> </tr> <tr> <td colspan="7"> <img src="images/Random.gif" width="265" height="46" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="46" alt=""></td> </tr> <tr> <td colspan="7"> <img src="images/appImages_18.gif" width="265" height="34" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="34" alt=""></td> </tr> <tr> <td colspan="2" rowspan="3"> <img src="images/appImages_19.gif" width="24" height="261" alt=""></td> <td colspan="4" rowspan="3" bgcolor="#25262A"> </td> <td rowspan="3"> <img src="images/appImages_21.gif" width="21" height="261" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="161" alt=""></td> </tr> <tr> <td colspan="5"> <img src="images/appImages_22.gif" width="600" height="1" alt=""></td> <td colspan="3" rowspan="6" bgcolor="#25262A"><table width="377" border="0"> <tr> <td style ="color: #3C3; text-align: right;" width="350" ><?php echo $row_RedCeleb['like']; ?>LIKES: </td> </tr> <tr> <td style ="color: #F00; text-align: right;"><?php echo $row_RedCeleb['dislike']; ?>DISLIKES: </td> </tr> <tr> <td style="color: #FFF; text-align: right;"><?php echo $row_RedCeleb['rating']; ?>% RATIO:</td> </tr> </table></td> <td> <img src="images/spacer.gif" width="1" height="1" alt=""></td> </tr> <tr> <td colspan="2" rowspan="5" bgcolor="#25262A"> <table width="377" border="0"> <tr> <td style ="color:#3C3" width="350" >LIKES: <?php echo $row_BlueCeleb['like']; ?></td> </tr> <tr> <td style ="color:#F00">DISLIKES: <?php echo $row_BlueCeleb['dislike']; ?></td> </tr> <tr> <td style="color:#FFF">% RATIO:<?php echo $row_BlueCeleb['rating']; ?></td> </tr> </table></td> <td colspan="3" rowspan="5" valign="top" bgcolor="#25262A"><table width="222" height="42" border="0"> <tr> <td valign="top"><img src="images/canvas_26.jpg" alt="" width="215" height="95" id="Image1" onmouseover="MM_swapImage('Image1','','images/canvas_26_down.jpg',1)" onmouseout="MM_swapImgRestore()"></td> </tr> </table></td> <td> <img src="images/spacer.gif" width="1" height="99" alt=""></td> </tr> <tr> <td rowspan="5"> <img src="images/appImages_26.gif" width="12" height="139" alt=""></td> <td colspan="2" bgcolor="#25262A"> </td> <td colspan="4"> <img src="images/appImages_28.gif" width="124" height="27" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="27" alt=""></td> </tr> <tr> <td colspan="3" bgcolor="#25262A"> </td> <td colspan="3"> <img src="images/appImages_30.gif" width="120" height="32" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="32" alt=""></td> </tr> <tr> <td colspan="4" bgcolor="#25262A"> </td> <td colspan="2" rowspan="3"> <img src="images/appImages_32.gif" width="101" height="80" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="28" alt=""></td> </tr> <tr> <td colspan="4" rowspan="2"> <img src="images/appImages_33.gif" width="152" height="52" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="28" alt=""></td> </tr> <tr> <td> <img src="images/appImages_34.gif" width="239" height="24" alt=""></td> <td colspan="2"> <img src="images/ToS.gif" width="213" height="24" alt=""></td> <td> <img src="images/Like.gif" width="117" height="24" alt=""></td> <td colspan="3" bgcolor="#25262A"> <img src="images/Contact.gif" width="154" height="24" alt=""></td> <td bgcolor="#25262A"> <img src="images/appImages_38.gif" width="222" height="24" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="24" alt=""></td> </tr> <tr> <td> <img src="images/spacer.gif" width="12" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="12" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="117" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="4" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="19" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="80" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="21" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="26" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="39" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="239" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="139" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="74" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="117" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="31" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="2" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="121" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="222" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="75" height="1" alt=""></td> <td></td> </tr> </table> </body> </html> I hope some of this makes sense to you guys! Edited March 10, 2013 by nyius Quote Link to comment Share on other sites More sharing options...
Rifts Posted March 11, 2013 Share Posted March 11, 2013 you should just use jquery and make an ajax request to get the new picture when the button is clicked. Quote Link to comment Share on other sites More sharing options...
nyius Posted March 11, 2013 Author Share Posted March 11, 2013 Yeah I've seen a couple posts about doing this using jquery, but I have literally 0 knowledge of jquery or how to implement it into my php\html coding Quote Link to comment Share on other sites More sharing options...
nyius Posted March 11, 2013 Author Share Posted March 11, 2013 Basically, to make things easier (as I didn't exactly explain it the greatest in my above post), all I want to do is load another random row from my database on button press, without needed to refresh the page. Theres going to be 1000+ rows so I can't take any shortcuts around this. I've also given each row a unique id (from 1-1000) to make things easier for grabing a random row, which i already have working with PhP. Quote Link to comment Share on other sites More sharing options...
drewdan Posted March 11, 2013 Share Posted March 11, 2013 if you want to do this without refreshing the page you will need to use jQuery (AJAX). PHP script execute before the page loads, to make things change without a page refreshing you will need to use jQuery as that runs client side. Quote Link to comment Share on other sites More sharing options...
nyius Posted March 11, 2013 Author Share Posted March 11, 2013 Yes so I've heard ^^ Only issue is I don't know any jquery coding I've tried searching online, but not many offer explanation to the code being used, or how to implement it into my own site Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.