|
-
Oct 2nd, 2010, 01:28 PM
#1
Thread Starter
Hyperactive Member
[RESOLVED] Process text field on image click
i have this form that works fine but now i have this jpg image next to one of my address text fields that i want to be able to click the image, before processing the form if the user decides to, and if there is text in the field then another window will open up to google maps.
this is what i have with just the image there
Code:
<tr>
<!-- Row 3 Column 1 -->
<td><span class="style14">Address:</span><br />
<input name="address" type="text" id="address" value="" size="35" maxlength="120" />
<img src="images/garmin.jpg" width="24" height="24"></td>
</tr>
this is what i have in one of my reports that works great at opening another window with a google map.
Code:
<td><font size="1" face="Arial, Helvetica, sans-serif"><a href="http://maps.google.com/maps?f=q&hl=en&q=<? echo urlencode($address); ?>" target="_blank">map it</a></font></td>
so i need to be able to take and combine the two but i cant figure out how to tell it to do with a click of the image.
-
Oct 2nd, 2010, 02:06 PM
#2
Re: Process text field on image click
You can put the image inside the link:
Code:
<a href="http://maps.google.com/maps?f=q&hl=en&q=<? echo urlencode($address); ?>" target="_blank"><img src="images/garmin.jpg" width="24" height="24" border="0"></a>
Or were you looking for something fancier?...
-
Oct 2nd, 2010, 02:16 PM
#3
Re: Process text field on image click
you would need to use JavaScript; PHP can't interact with the client. if you give the image an ID, you can add an onclick event:
Code:
<script type="text/javascript">
document.getElementById("imageID").onclick = function(){
// Get the address
var address = document.getElementById("address").value;
// Encode the address
address = encodeURIComponent(address);
// Construct a URL
var url = "http://maps.google.com/maps?f=q&hl=en&q=" + address;
// Open URL in new window
window.open(url);
};
</script>
edit: just saw Samba had posted; I assumed that when he said he wanted to combine the two, he actually wanted to make it instant -- so I opted for JavaScript.
-
Oct 2nd, 2010, 05:58 PM
#4
Re: Process text field on image click
I think you're right and I oversimplified the question, kows.
It's Saturday and it's hot.
-
Oct 3rd, 2010, 01:01 PM
#5
Thread Starter
Hyperactive Member
Re: Process text field on image click
Kows,
that worked great. thank you. for any one else who might be interested in what i did. i used Kows java script code as is and in my image link i just added the id like this
Code:
<img src="images/garmin.jpg" id="imageID" width="24" height="24"></td>
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
Click Here to Expand Forum to Full Width
|