Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

Click on Image/Open info in different Table on same page!

Posted on 2003-11-20
8
256 Views
Last Modified: 2013-12-24
I have two tables on the same page. Nothing real elaberate. The top table has the page info and several smaller images that when "clicked" will display their info. How do I get the smaller image's info to display in the second table without it reloading the page?

thanxx
0
Comment
Question by:elixxer
8 Comments
 
LVL 31

Expert Comment

by:seanpowell
ID: 9790788
Can you post the code for what you have now, so we can look at the best way to add that functionality?
0
 
LVL 14

Expert Comment

by:hhammash
ID: 9790938
Hi,

You can do it in two ways (without programming)

Method 1
-----------
On the same page you will have the table that has the images and underneath it the table that will display the information of the image.

Make each table as a DRW,  the second table which will display the info will be a DRW that is waiting for the info from the hyperlink.  When you click on the picture the second DRW (the table which will display info) will display the information.

In the Picture Hyperlink include a parameter so when clicked,  the destination will be the same page.  www.pagename?id=900

Method 2
----------
Create the second table (DRW) on a separate page and call it Details.asp

Go back to the first page that has the table with the images and go under the table and insert an Inline Frame:  Insert>Inline Frame

Set the Inline Frame properties to display Details.asp page. The picture hyperlink should have parameters holding info that the second DRW is waiting for.

You can remove the Inline frame borders and  you can make it look like a part of the page. You can extend it Vertically and Horizontally to be able to hold the entire page,  in this case the scroll bars will not appear.

Regards
hhammash
0
 
LVL 23

Expert Comment

by:Saqib Khan
ID: 9797850
Very Easy Approach.
Code is Really simple and Easy to Modify.
Give it a Try and let me know if you have any questions.
(Copy and paste into notepad, Save as .html to see this Code in action).

<html>

<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
<Script>
// Define HTML for your imgaes information

html_1 = "<b>You Clicked Image1</b>"
html_2 = "<b>You Clicked Image 2!</b>"

function info(whi, i)      {

// whi is the ID name <div> within your table, and i is the index WHICH html variable you want to assign

document.getElementById(whi).innerHTML = eval("html_"+i)
document.getElementById(whi).innerHTML = eval("html_"+i)

}

// See below how the function is been used.

</Script>
</head>

<body>

<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" id="AutoNumber1">
  <tr>
    <td width="50%"><a href="javaScript:info('info', 1)">Image 1 info</a></td>
    <td width="50%"><a href="javaScript:info('info', 2)">Image 2 Info</a></td>
  </tr>

</table><br>
<table border="3" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#800000" width="100%" id="AutoNumber2">
  <tr>
    <td width="100%"><div id="info">Select a Image</div></td>
  </tr>
</table>

</body>

</html>
0
What is SQL Server and how does it work?

The purpose of this paper is to provide you background on SQL Server. It’s your self-study guide for learning fundamentals. It includes both the history of SQL and its technical basics. Concepts and definitions will form the solid foundation of your future DBA expertise.

 

Author Comment

by:elixxer
ID: 9875431
Please close. Currently I will not be needing this as I am not going to use it.
0
 
LVL 23

Expert Comment

by:Saqib Khan
ID: 11050810
But what about Expert's input. this means we were just wasting our time when we were trying to help him/her?
0
 
LVL 29

Expert Comment

by:coreybryant
ID: 11050844
Asker did request to close this question 5 months ago with no input at that time from anyone.

-Corey
0
 
LVL 29

Accepted Solution

by:
coreybryant earned 0 total points
ID: 11089875
force accept
coreybryant
FP Page Editor
0

Featured Post

Free learning courses: Active Directory Deep Dive

Get a firm grasp on your IT environment when you learn Active Directory best practices with Veeam! Watch all, or choose any amount, of this three-part webinar series to improve your skills. From the basics to virtualization and backup, we got you covered.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Turn A Profile Picture Into A Cartoon Using Photoshop And Illustrator This tutorial will teach you how to make a cartoon style image out of a regular picture. I have tried to keep the tutorial as simple as possible. I used Adobe CS4 for this tuto…
This guide will walk you through the essential considerations and tech stack for building scalable websites. Know how to grow your business the smart way!
The purpose of this video is to demonstrate how to create a Printer Friendly PDF on a WordPress Page. This will be demonstrated using a Windows 8 PC. Tools Used are Photoshop, Awesome Screenshot” Google Chrome Extension, and SmallPDF.com Log…
The purpose of this video is to demonstrate how to add AdSense Ads to a WordPress Website, and how to set up WordPress to automatically place Ads in Sidebars. This will be demonstrated using a Windows 8 PC. Log into your AdSense account. : Cli…

839 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question