11fish
11fish

Reputation: 19

Having an image that sends info when clicked to variable for mySQL Query

I want to make a picture send a specific value tied to that image when clicked to a php file that will make a mySQL query.

For example let say I have a HTML page of animal pictures that when a specific animal image is clicked, say an image of a Cat, it would sent that as a value to be assigned to a variable that is then put into a MySQL query that will pull out different breeds of cats from an animal database containing cats,dogs, horses, ect.

So in the HTML page, animals.html, I am creating the images with this code:

//animals.html
<form action="animalQuery.php" method="get"> <input type="image" src="Cat.jpg" name="cats" width="350" height="225">
<form action="animalQuery.php" method="get"> <input type="image" src="Dog.jpg" name="dogs" width="350" height="225">

When the Cat.jpg image is clicked I want to send the value “cats” to be assigned to $animal variable so that it basically makes the $stmt below equate to “select * from Animals where breeds = ‘cats’;" which is a working Query.

//animalQuery.php
$animal=$_GET["cats"]; 
$stmt="select * from Animals where breeds =  $animal;";

It works if I hard code the $stmt with value of “cats” or “dogs” in place of the variable $animal, so I know the Query works. I am just having trouble figuring out how to have the image when clicked send the specific value I want to that variable $animal. Once I figure that out I should be able to figure out how to have the single variable $animal get set to a certain value when one of the many images is clicked so that one variable works for all the images.

Upvotes: 1

Views: 150

Answers (4)

Gavin Flood
Gavin Flood

Reputation: 1

I had a similar problem to this a while back, and it came about because some browsers send image coordinates as the values as opposed to the actual value you specify. The easiest way to solve that particular problem (if you have to use image inputs) would be to include hidden values.

<form action="animalQuery.php" method="GET">
    <input type="hidden" name="animal" value="cat" />
    <input type="image" src="Cat.jpg" />
</form>

Then retrieve the value in your animalQuery.php file.

<?php
$animal = $_GET['animal'];
$stmt = "select * from Animals where breeds = '$animal';";
?>

Upvotes: 0

Chris
Chris

Reputation: 3338

An alternate way to approach your problem might be to replace your inputs with links. For example:

<a href="animalQuery.php?animal=cats"><img src="Cat.jpg" width="350" height="225" /></a>
<a href="animalQuery.php?animal=dogs"><img src="Dog.jpg" width="350" height="225" /></a>

You could then update animalQuery.php to work like this:

$animal=$_GET['animal'];

You can see an example of this on this page:

https://stackoverflow.com/tags

You'll see that each tag is a link, not an input field:

<a href="/questions/tagged/c%23" class="post-tag" title="show questions tagged 'c#'" rel="tag">c#</a>
...
<a href="/questions/tagged/java" class="post-tag" title="show questions tagged 'java'" rel="tag">java</a>
...
<a href="/questions/tagged/php" class="post-tag" title="show questions tagged 'php'" rel="tag">php</a>

Finally, you should look into the MySQLi or PDO library for writing your SQL. If someone were to visit this page: animalQuery.php?animal=cats UNION SELECT * FROM information_schema.tables, then they might be able to hack your site.

Upvotes: 0

Marc B
Marc B

Reputation: 360562

Why a full-blown form for something so simple?

<a href="animalQuery.php?animal=cat"><img src="..." /></a>
<a href="animalQuery.php?animal=dog"><img src="..." /></a>

Upvotes: 2

Green Black
Green Black

Reputation: 5084

In the form, give the buttons the same name, and catch the value in PHP. You can do that like this:

<form action="animalQuery.php" method="get"> 
 <input type="image" src="Cat.jpg" name="animal" value="Cat" width="350" height="225">
 <input type="image" src="Dog.jpg" name="animal" value="Dog" width="350" height="225">
</form>


<?php 
//Set the possible values
$animals = array( "Cat", "Dog");
//Check if the form is submitted and set the value if the value exists
$animal = isset( $_GET['animal']) && 
          in_array( $_GET['animal'], $animals)? $_GET['animal'] : "Not chosen";

Upvotes: 0

Related Questions