[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.

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?...

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.

I think you're right and I oversimplified the question, kows.

It's Saturday and it's hot.

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>

---