472,789 Members | 1,173 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 472,789 software developers and data experts.

Image popup from E-commerce store

Hello All!

Having a bit of a problem combining php with javascript here. What I have is a store with images (There will be a smaller image of each item, and a larger image of each item, but I want users to click on a link under the image shown (Smaller image) for a popup window showing a larger image. I have already setup an additional table line named "image2" and want the image be puleed from the db (images folder) to pop up to a window that will default 20 pixels around the image.

Here is the script I placed in the head of the script:
Expand|Select|Wrap|Line Numbers
  1. <script language="javascript">
  2. <!-- //Hide from old browsers.
  4. //Make a pop-up window function
  5. function create_window (image, width, height) {
  7.     // Add some pixel dimensions here.
  8.     width = width + 20;
  9.     height = height + 40;
  11.     // If the window is already open, resize it to the new dimensions.
  12.     if (window.popup_window && !window.popup_window.closed) {
  13.         window.popup_window.resizeTo (width, height);
  14.         }
  15.         //set the window properties
  16.         var window_specs = "location=no, scrollbars=no, menubars=no, toolbars=no, resizable=yes,
  17.         left=0, top=0, width=" + width + ", height=" + height;
  19.         //Set the URL
  20.         var url = "image_window.php?image=" + image;
  22.         //Create the pop-up window.
  23.         popup_window = window.open(url, "PictureWindow", window_specs);
  24.         popup_window.focus();
  26. } //End of function
  27. //--></script>
  29. OK, here is my php script on the store page:
  31. <?php
  33. require_once('mysql_connect.php');
  34. if (isset($_GET['page'])) {
  35.     $page = $_GET['page'];
  36. } else {
  37.     $page = 1;
  38. }
  39. $where = NULL;
  40. $link = NULL;
  41. $order = 'ItemID DESC';
  43. if(isset($_GET['submit'])) {
  44.     $order = $_GET['order'];
  45.     if($_GET['category'] != '0') {
  46.         $category = $_GET['category'];
  47.         $where .= " AND CategoryID = '$category'";
  48.         $vlink = "$page&category=$category&order=$order&submit=Search";
  49.         $_SESSION['vlink'] = $vlink;
  50.         $link = "&category=$category&order=$order&submit=Search";
  51.     } else {
  52.         $vlink = "$page&category=0&order=$order&submit=Search";
  53.     }
  54.     $_SESSION['vlink'] = $vlink;
  55. }
  56. ?>
  57. <table border="0" width="587"><tr><td width="18">&nbsp;</td><td width="559">
  58. <form name="form1" method="get" action="">
  59.   <table width="500" height="29" border="0" cellpadding="1" cellspacing="1" bgcolor="#CCCCCC" bordercolordark="#000000">
  60.     <tr> 
  61.       <td width="57" height="27" align="right" nowrap><font size="2">Category:</font></td>
  62.       <td width="140"><font size="2"> 
  63.         <select name="category">
  64.         <option value="0" selected>Choose a Category</option>
  65.         <?php
  66.         $u = NULL;
  67.         $qu = mysql_query("SELECT I.CategoryID, C.Name FROM Items I, Category C WHERE I.CategoryID = C.CategoryID AND I.InUse = 'Yes' ORDER BY I.CategoryID");
  68.         while($r = mysql_fetch_array($qu, MYSQL_NUM)) {
  69.             if($r[0] != $u) {
  70.                 echo "<option value='$r[0]'>$r[1]</option>";
  71.             }
  72.             $u = $r[0];
  73.         }
  74.         ?>
  75.         </select>
  76.         </font></td>
  77.       <td width="106" align="right" nowrap><font size="2">Order By:</font></td>
  78.       <td width="98" nowrap><font size="2"> 
  79.         <select name="order" id="select3">
  80.           <option value="Name" selected>Name</option>
  81.           <option value="Price">Price</option>
  82.         </select>
  83.         </font></td>
  84.       <td width="83" align="right" nowrap><input name="submit" type="submit" id="submit2" value="Search"></td>
  85.     </tr>
  86.   </table>
  87. </form>
  88. <?php
  89. $alt = 'first';
  90. $page = $page-1;
  91. $pag = $page*20;
  92. $q = mysql_query ("SELECT ItemID FROM Items WHERE InUse = 'Yes'$where ORDER BY $order");
  93. $query = mysql_query ("SELECT ItemID, Image, Name, Price, Sale, Description, Tax, Shipping, Image2, Inventory FROM Items WHERE InUse = 'Yes'$where ORDER BY $order LIMIT $pag, 20");
  94. $n = mysql_num_rows($q);
  95. $num = $n/20;
  96. $num = ceil($num);
  97. while($row = mysql_fetch_array($query, MYSQL_NUM)) {
  98.     echo "<table width='550' border='1' cellspacing='0' cellpadding='2' bgcolor='#EFEFEF' bordercolor='#000000'>
  99.               <tr> 
  100.                 <td width=80 rowspan='2'><img src='items/$row[1]' border=0>
  101.              <strong><font size='1' face='Arial, Helvetica, sans-serif'>             
  104.              <br> Click here for larger image. </br></font></strong>
  105.              </td>
  107.                 <td><strong><font size='2' face='Arial, Helvetica, sans-serif'>Name: $row[2]</font></strong></td>";
  108.                if ($row[4] != 'No') {
  109.                   echo "<td><strong><font size='1' face='Arial, Helvetica, sans-serif' color='red'>Sale Price: $row[4]</font></strong></td>";
  110.               } else {
  111.                   echo "<td><strong><font size='1' face='Arial, Helvetica, sans-serif'>Price: $$row[3]</font></strong></td>";
  112.              }
  113.              echo "<td width=80 rowspan='2' align=center nowrap><a href='add_cart.php?pid=$row[0]'><font size='2' face='Arial, Helvetica, sans-serif'>Add to cart</font></a></td>
  114.              </tr>
  115.               <tr> 
  116.                 <td colspan='2' valign=top><font size='1' face='Arial, Helvetica, sans-serif'><strong>Description: $row[5]
  117.               </strong></font></td>
  118.               </tr>
  119.         </table><br>";
  120. }
  121. echo "<font size=2>&lt;&lt;Prev ";
  122. $a = 0;
  123. while ($a < $num) {
  124.     $a++;
  125.     echo "<a href='index.php?page=$a$link'>$a</a>";
  126.     if ($a != $num) {
  127.         echo " - ";
  128.     }
  129. }
  130. echo " Next&gt;&gt;</font>";
  132. //<form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
  133. //<input type="image" src="https://www.paypal.com/en_US/i/btn/x-click-but22.gif" border="0" name="submit" alt="Make payments with PayPal - it's fast, free and secure!">
  134. //<input type="hidden" name="add" value="1">
  135. //<input type="hidden" name="cmd" value="_cart">
  136. //<input type="hidden" name="business" value="johnny@anywhere.com">
  137. //<input type="hidden" name="item_name" value="ItemName">
  138. //<input type="hidden" name="item_number" value="ItemID">
  139. //<input type="hidden" name="amount" value="1.00">
  140. //<input type="hidden" name="no_note" value="1">
  141. //<input type="hidden" name="currency_code" value="USD">
  142. //<input type="hidden" name="lc" value="US">
  143. //<input type="hidden" name="bn" value="PP-ShopCartBF">
  144. //</form>
  145. ?>

Any suggestions would be greatly appreciated! Thanks...
Oct 6 '06 #1
0 1765

Sign in to post your reply or Sign up for a free account.

Similar topics

by: riki | last post by:
hi, i've asked this question before and didn't get an answer...maybe i didn't explain it well so i'll try again... -------------------------------------- main.html i'm calling popUp like...
by: Jake | last post by:
Hi, I have a page with a bunch of thumbnails that when clicked, open the full size image in a new window. They are all different sizes and its a bit unprofessional looking. I'd like to find a...
by: D. Alvarado | last post by:
Hello, I am trying to open a window containing an image and I would like the image to be flush against the window -- i.e. have no padding or border. Can I make this happen with a single call to a...
by: zborisau | last post by:
Hey good people, I've been given a problem to solve recently - and stuck with the solution for a good 4 days already. i have a link which leads to popup window. the purpose of that popup...
by: Tim::.. | last post by:
Please, please, please help!!! I have a datagrid that displays a list of contacts on our intranet site using the ActiveDirectory as it's main Data Source. I want to be able to show an image of...
by: Karl | last post by:
Hi, Ok so on a given page I have 4 text links: see it in black see it in blue see it in red see it in green using the standard swap image behavior, clicking on one of the above links
by: skim1114 | last post by:
I have this code in my popup window, which works perfectly except that I need it to display a new title for every image. Here the popup window code: <HTML> <HEAD> <TITLE>DETAIL</TITLE>...
by: bebu | last post by:
I am a beginner with very basic knowledge of Javascript. Please help me to modify this script. When somebody clicks on the thumbnail to open up the enlarged popup image ( not an html page). I...
by: nickwang | last post by:
Hi, does any javascript framework can implement image popup tip when mouse hover an object? Mootool has a text popup tips. Is it easy to inherit it and create a popup tip with images or other...
by: jntmac | last post by:
I cannot find the answer anywhere on the entire net: I have an image on my website. The image shows a newsletter, and the image says "Click here to register to receive our newsletter". I know...
by: Rina0 | last post by:
Cybersecurity engineering is a specialized field that focuses on the design, development, and implementation of systems, processes, and technologies that protect against cyber threats and...
by: erikbower65 | last post by:
Using CodiumAI's pr-agent is simple and powerful. Follow these steps: 1. Install CodiumAI CLI: Ensure Node.js is installed, then run 'npm install -g codiumai' in the terminal. 2. Connect to...
by: linyimin | last post by:
Spring Startup Analyzer generates an interactive Spring application startup report that lets you understand what contributes to the application startup time and helps to optimize it. Support for...
by: erikbower65 | last post by:
Here's a concise step-by-step guide for manually installing IntelliJ IDEA: 1. Download: Visit the official JetBrains website and download the IntelliJ IDEA Community or Ultimate edition based on...
by: Taofi | last post by:
I try to insert a new record but the error message says the number of query names and destination fields are not the same This are my field names ID, Budgeted, Actual, Status and Differences ...
by: Rina0 | last post by:
I am looking for a Python code to find the longest common subsequence of two strings. I found this blog post that describes the length of longest common subsequence problem and provides a solution in...
by: lllomh | last post by:
Define the method first this.state = { buttonBackgroundColor: 'green', isBlinking: false, // A new status is added to identify whether the button is blinking or not } autoStart=()=>{
by: lllomh | last post by:
How does React native implement an English player?
by: DJRhino | last post by:
Was curious if anyone else was having this same issue or not.... I was just Up/Down graded to windows 11 and now my access combo boxes are not acting right. With win 10 I could start typing...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.