Solved

get value if image clicked javascript php

Posted on 2010-11-21
8
597 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
Comment Utility
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
Comment Utility
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
Comment Utility
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
 
LVL 1

Author Comment

by:debbieau1
Comment Utility
Thanks for responses.  Ali I can't seem to get yours to work.  I added a form but it still doesnt work
0
How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

 
LVL 14

Expert Comment

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

Author Comment

by:debbieau1
Comment Utility
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
Comment Utility
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
Comment Utility
Thanks.
0

Featured Post

6 Surprising Benefits of Threat Intelligence

All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

Join & Write a Comment

These days socially coordinated efforts have turned into a critical requirement for enterprises.
Password hashing is better than message digests or encryption, and you should be using it instead of message digests or encryption.  Find out why and how in this article, which supplements the original article on PHP Client Registration, Login, Logo…
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

772 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

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now