Solved

get value if image clicked javascript php

Posted on 2010-11-21
8
605 Views
Last Modified: 2013-12-13
I have two groups of images (animals, and clothes).  When the image is clicked I want to get the value.    Eg. $animal = 2 (this mean that the dog image was clicked)

So after clicking I might have $animal = 2  $clothes = 1

<img src="images/cat.png" width="49" height="50" value="1"/><img src="images/dog.png" alt="" width="49" height="50" value="2" /><img src="images/cow.png" alt="" width="49" height="50" value="3" />
<img src="images/horse.png" alt="" width="49" height="50" value="4"/>

<img src="images/jumper.png" alt="" width="49" height="50" value ="1"/>
<img src="images/dress.png" alt="" width="49" height="50" value="2" />
<img src="images/jacket.png" alt="" width="49" height="50" value="3" />
0
Comment
Question by:debbieau1
  • 4
  • 3
8 Comments
 
LVL 14

Expert Comment

by:ali_kayahan
ID: 34185268
Here is your html ;

 
<!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=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://85.159.69.158/mail/jq.js"></script>
<script>
	var animal ;
	var clothes ;
	function submitMe(){
		$.post('myphpfile.php',{animal : animal,clothes : clothes},function(reply){
				alert(reply);
		});	
	}
</script>
</head>

<body>
<img src="images/cat.png" width="49" height="50" value="1" onclick="animal = 1" />
<img src="images/dog.png" alt="" width="49" height="50" value="2" onclick="animal = 2" />
<img src="images/cow.png" alt="" width="49" height="50" value="3" onclick="animal = 3" />
<img src="images/horse.png" alt="" width="49" height="50" value="4"  onclick="animal = 4" />

<img src="images/jumper.png" alt="" width="49" height="50" value ="1"  onclick="clothes = 1" />
<img src="images/dress.png" alt="" width="49" height="50" value="2"  onclick="clothes = 2"  />
<img src="images/jacket.png" alt="" width="49" height="50" value="3" onclick="clothes = 3"/>
<input type="button" onclick="submitMe()" value="Sumit Me" />
</body>
</html>

Open in new window


Here is your myphpfile.php ;

 
<?php
	extract($_POST);
	echo $clothes."<br />" ;
	echo $animal ;
?>

Open in new window

0
 
LVL 3

Assisted Solution

by:boraganesh
boraganesh earned 100 total points
ID: 34185436
for each img tag add onclick event function callMe and pass the value which you would like to get as follows

onclick=callMe("")

<img src="images/jumper.png" alt="" width="49" height="50" value ="1" onclick="callme('1')"/>
<img src="images/dress.png" alt="" width="49" height="50" value="2" onclick="callme('2')"/>
<img src="images/jacket.png" alt="" width="49" height="50" value="3" onclick="callme('3')"/>


writre javascript function
callMe(imgvalue){
//code which you want for these images....

}
0
 
LVL 14

Expert Comment

by:ali_kayahan
ID: 34186771
As i understand he needs both values at the same time

So after clicking I might have $animal = 2  $clothes = 1

So using a kind of submit would be better instead of submitting onclick
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 1

Author Comment

by:debbieau1
ID: 34192680
Thanks for responses.  Ali I can't seem to get yours to work.  I added a form but it still doesnt work
0
 
LVL 14

Expert Comment

by:ali_kayahan
ID: 34198233
debbie ; My answer works well for me locally , is there a link to your site ?
0
 
LVL 1

Author Comment

by:debbieau1
ID: 34214383
Very for sorry for delay, missed your reply.  I was trying to test locally.  Do you have the code that is in the jq.js file?

Also does it need to save it to an external file Ali?
0
 
LVL 14

Accepted Solution

by:
ali_kayahan earned 400 total points
ID: 34217869
Debbie if you just copy and paste http://85.159.69.158/mail/jq.js in your address bar you can download it .

Yes saving jq.js as external file would be better .
0
 
LVL 1

Author Closing Comment

by:debbieau1
ID: 34220468
Thanks.
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

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

This article discusses four methods for overlaying images in a container on a web page
3 proven steps to speed up Magento powered sites. The article focus is on optimizing time to first byte (TTFB), full page caching and configuring server for optimal performance.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.

713 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