Go Back   TechArena Community > Software > Software Development
Become a Member!
Forgot your username/password?
Tags Active Topics RSS Search Mark Forums Read

Reply
 
Thread Tools Search this Thread
  #1  
Old 03-11-2009
Member
 
Join Date: Aug 2009
Posts: 53
HTML/JavaScript/onclick

I just created a site with a form, there is a link that opens a popup that displays an image database. This image bank is shown with radio buttons just below to the unique selection.

HTML Code:
<table>
  <tr>
    <td><img src=miniature1.jpg><br><input type="radio" name="user" value="photo1"></td>
    <td><img src=miniature2.jpg><br><input type="radio" name="user" value="photo2"></td>
    <td><img src=miniature3.jpg><br><input type="radio" name="user" value="photo3"></td>
  </tr>
  <tr>
    <td><img src=miniature1.jpg><br><input type="radio" name="user" value="photo4"></td>
    <td><img src=miniature2.jpg><br><input type="radio" name="user" value="photo5"></td>
    <td><img src=miniature3.jpg><br><input type="radio" name="user" value="photo6"></td>
  </tr>
</table>
I wish that when I click the radio button, the popup closes and paste this in my form value example:

HTML Code:
<photo>photo1</photo>
Reply With Quote
  #2  
Old 03-11-2009
Member
 
Join Date: Nov 2008
Posts: 1,192
Re: HTML/JavaScript/onclick

I would try something like:

HTML Code:
<input type="radio" name="user" value="photo3" onclick="Select(this.value);">
and in your JavaScript file, you declare your function:

HTML Code:
function Select(val)
{
   //we fill the form of the parent page
   window.opener.getelementById('id_of_field_form').value = '<photo>photo' + val + '</photo>';
   // we close this popup
   window.close();
}
You just see if the getElementById apply well in the parent window
Reply With Quote
  #3  
Old 03-11-2009
Member
 
Join Date: Aug 2009
Posts: 53
Re: HTML/JavaScript/onclick

I wish I could center my web page, I've tried that:
as the device width:100%, margin:auto, but it must be put into #body or the <div>?
Reply With Quote
  #4  
Old 03-11-2009
Member
 
Join Date: Oct 2005
Posts: 2,389
Re: HTML/JavaScript/onclick

If you made an effort to spin your HTML and your CSS code, can you provide us some more part of your code so that it would be helpful to give the proper guidance and solve your problem accurately?
Reply With Quote
  #5  
Old 03-11-2009
Member
 
Join Date: Aug 2009
Posts: 53
Re: HTML/JavaScript/onclick

My code :

HTML Code:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
#menu2 {
 position:absolute;
 left:467px;
 top:225px;
 width:285px;
 height:28px;
 z-index:15;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-weight: normal;
 color: #000000;
 font-size: 16px;
 border-right-width: 1px;
 border-right-style: solid;
 border-right-color: #000000;
}
#menu3 {
 position:absolute;
 left:754px;
 top:225px;
 width:233px;
 height:27px;
 z-index:16;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-weight: normal;
 color: #FFFFFF;
 font-size: 16px;
 border-bottom-color: #FFFFFF;
 border-right-width: 1px;
 border-right-style: solid;
 border-right-color: #000000;
}
 
#banner{
    width:100%;
 position:absolute;
 left:195px;
 top:-1px;
 width:1019px;
 margin:0 auto 0 auto;
 height:194px;
 z-index:16;
 background-color: #FFFFFF;
}
#menu4 {
 position:absolute;
 left:989px;
 top:225px;
 width:260px;
 height:27px;
 z-index:6;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-weight: normal;
 color: #FFFFFF;
 font-size: 16px;
 border-right-width: 0px;
 border-right-style: solid;
 border-right-color: #000000;
}
#menu1 {
 position:absolute;
 left:198px;
 top:225px;
 width:267px;
 height:27px;
 z-index:7;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-weight: normal;
 color: #000000;
 font-size: 16px;
 border-right-width: 1px;
 border-right-style: solid;
 border-right-color: #000000;
}
a:link {
 color: #000000;
 text-decoration: none;
}
a:visited {
 text-decoration: none;
 color: #000000;
}
a:hover {
 text-decoration: none;
 color: #FFFFFF;
}
a:active {
 text-decoration: none;
 color: #000000;
}
body {  
    position:absolute;
    width:600px;
 margin-left:auto;
    margin-right:auto;
 text-align:center;
 background-image: url();
 background-repeat: no-repeat;
}
#real {
 position:absolute;
 left:399px;
 top:305px;
 width:661px;
 height:81px;
 z-index:8;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 16px;
 line-height: normal;
 color: #000000;
}
#banner {
 position:absolute;
 left:195px;
 top:198px;
 width:308px;
 height:570px;
 z-index:2;
 background-color: #D2D3FB;
}
#sarl {
 position:absolute;
 left:551px;
 top:719px;
 width:644px;
 height:142px;
 z-index:9;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 14px;
}
#Layer3 {
 position:absolute;
 left:0px;
 top:0px;
 width:739px;
 height:404px;
 z-index:10;
}
#Layer1 {
 position:absolute;
 left:574px;
 top:600px;
 width:104px;
 height:124px;
 z-index:10;
}
#manager{
 position:absolute;
 left:575px;
 top:574px;
 width:137px;
 height:25px;
 z-index:11;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 14px;
}
#Layer2 {
 position:absolute;
 left:748px;
 top:601px;
 width:124px;
 height:137px;
 z-index:12;
}
#resp {
 position:absolute;
 left:733px;
 top:574px;
 width:165px;
 height:26px;
 z-index:13;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 14px;
}
#Layer5 {
 position:absolute;
 left:801px;
 top:521px;
 width:379px;
 height:391px;
 z-index:14;
}
#Layer6 {
 position:absolute;
 left:449px;
 top:189px;
 width:855px;
 height:759px;
 z-index:1;
 background-color: #FFFFFF;
}
.style3 {
 color: #000000;
 font-weight: bold;
}
.style5 {
 font-size: 16;
 font-weight: bold;
}
#resume {
 position:absolute;
 left:392px;
 top:439px;
 width:699px;
 height:107px;
 z-index:14;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 14px;
}
#Layer4 {
 position:absolute;
 left:504px;
 top:804px;
 width:740px;
 height:117px;
 z-index:15;
}
#Layer7 {
 position:absolute;
 left:550px;
 top:737px;
 width:580px;
 height:79px;
 z-index:15;
}
#Layer8 {
 position:absolute;
 left:195px;
 top:194px;
 width:1058px;
 height:557px;
 z-index:2;
}
#Layer9 {
 position:absolute;
 left:0px;
 top:0px;
 width:154px;
 height:79px;
 z-index:15;
}
#Layer10 {
 position:absolute;
 left:194px;
 top:168px;
 width:1054px;
 height:600px;
 z-index:15;
}
#Layer11 {
 position:absolute;
 left:577px;
 top:64px;
 width:283px;
 height:130px;
 z-index:17;
 font-family: Arial, Helvetica, sans-serif;
 font-size: 36px;
-->
</style>
</head>
 
<body>
<center>
<div id="menu2">
  <p align="center"><a href="service.html" class="style3"> PRODUCTS AND SERVICES </a></p>
</div>
<div id="menu3">
  <p align="center"><a href="provider.html"><strong> PROVIDER</strong></a></p>
</div>
<div id="banner"><img src="images/banner.jpg" width="1056" height="202" longdesc="images/Sans title-1.jpg" /></div>
<div id="menu4">
  <p align="center"><a href="contact.html"><strong>CONTACT</strong></a></p>
</div>
<div id="menu1">
  <div align="center" class="style5">PRESENTATION</div>
</div>
<div id="real">  
  <p align="center" class="style5">Execution of the works without intermediaries, or subcontract.</p>
  <p align="center"><strong>A company supplying and installing windows, doors, shutters, fully accountable to human scale. </strong></p>
  <p align="left">&nbsp;</p>
</div>
<div id="Layer1"><img src="images/second copy.jpg" width="137" height="140" longdesc="images/second copy.jpg" /></div>
<div id="manager">
  <div align="center">Manager</div>
</div>
<div id="Layer2"><img src="images/third copy.jpg" width="134" height="138" longdesc="images/third copy.jpg" /></div>
<div id="resp">
  <div align="center">Service Manager </div>
</div>
<div id="resume">
  <div align="justify">
    <p align="justify">After CAP locksmith specializing in the construction of windows and mirrors, to follow a long period as a controller works. During the creation of our society, first time we have worked under contract for major brands of window manufacturer. Today our company has extensive experience allows us to offer you the supply and installation of windows, doors, shutters and other products of Indian manufacture.</p>
  </div>
</div>
<div id="Layer8"><img src="images/window-2 copy copy.jpg" width="1056" height="556" lowsrc="images/window-2 copy copy.jpg" longdesc="images/window-2 copy copy.jpg" /></div>
<p>&nbsp;</p>
</center>
</body>
</html>
Reply With Quote
Reply

  TechArena Community > Software > Software Development
Tags: , ,



Thread Tools Search this Thread
Search this Thread:

Advanced Search


Similar Threads for: "HTML/JavaScript/onclick"
Thread Thread Starter Forum Replies Last Post
using href vs. onclick to call javascript function Kalyug Software Development 6 12-05-2010 10:09 AM
How to keep rollover image onClick in javascript? MAGALY Software Development 4 08-03-2010 08:02 PM
How to use javascript to create HTML and CSS KennedII Software Development 5 23-02-2010 12:10 AM
How to disable Javascript parent onclick? Reckon Software Development 3 19-08-2009 10:48 AM
how to i get html codes to run onclick of a button? cordless33 Software Development 7 05-05-2009 09:53 AM


All times are GMT +5.5. The time now is 03:52 AM.