Reputation: 41
I'm attempting to load data from a MySQL database using PHP and submit images in HTML. Upon clicking a particular image, some text associated with the image will load onto the page via MySQL/PHP. I would like to accomplish this without using many isset statements.
HTML:
<input type="image" name="image1" src="img/image1.jpg"></input>
<input type="image" name="image2" src="img/image2.jpg"></input>
<input type="image" name="image3" src="img/image3.jpg"></input>
<input type="image" name="image4" src="img/image4.jpg"></input>
<input type="image" name="image5" src="img/image5.jpg"></input>
(I have several more inputs like those shown above but have reduced it to five inputs for succinctness)
PHP:
if(isset($_POST["image1"])){
//load mysql data associated with image 1
}
if(isset($_POST["image2"])){
//load mysql data associated with image 2
}
if(isset($_POST["image3"])){
//load mysql data associated with image 3
}
if(isset($_POST["image4"])){
//load mysql data associated with image 4
}
if(isset($_POST["image5"])){
//load mysql data associated with image 5
}
I have about 30 of these images, so naturally I would like to avoid doing an "if(isset)" statement for every single image, like I've demonstrated above. Is there anyway to handle each of these unique input names using one isset statement? Perhaps using looping? Thanks.
Upvotes: 1
Views: 92
Reputation: 760
One line (untested)
$images = array_filter(array_map(range(1,31), function($i){return isset($_POST['image' . $i]) ? $_POST['image' . $i] : false;}));
Upvotes: 0
Reputation: 2010
Here's a second answer, completely different approach because it's after a higher understanding of the problem at hand. First, image inputs return the x,y through GET seemingly no matter what. This is problematic if you want to use the x,y in some calculation for POST. What we can do however is use JavaScript to get the x,y and set up an AJAX call with that information.
While my other answer has been accepted, I believe this is the more correct answer.
HTML
<input type="image" name="image1" src="img/1.png"></input>
<input type="image" name="image2" src="img/2.png"></input>
<input type="image" name="image3" src="img/3.png"></input>
<input type="image" name="image4" src="img/4.png"></input>
<input type="image" name="image5" src="img/5.png"></input>
JavaScript
I'm using jQuery for simplicity. You can do this without jQuery.
$('input[type="image"]').on('click',function(e){
// Do not go to next page
e.preventDefault();
// Prepare necessary structure
var offset = $(this).offset();
var postData = {
'name': $(this).attr('name'),
'x': e.pageX - offset.left,
'y': e.pageY - offset.top
};
// AJAX Call
$.ajax({
url: 'ajax.php',
method: 'POST',
data: postData,
dataType: 'html',
success: function(data){
// Do something
}
});
});
PHP
$whiteList = array('image1','image2','image3','image4','image5');
if( in_array($_POST['name'],$whiteList) ){
// Process
}
The structure of $_POST
will look as follows if I click on (267,60):
Array
(
[name] => image1
[x] => 267
[y] => 60
)
Upvotes: 1
Reputation: 2010
You can have an array of strings where each string is a name of a valid input field, and then you can do a loop over $_POST
and see if each string is set there:
$validInputs = array('image1','image2','image3','image4','image5');
foreach( $_POST as $k=>$v ){
if( in_array($k,$validInputs) ){
// Do something
}
}
This type of setup assumes that image processing is identical save for the name. This method of using a whitelist for inputs is pretty handy in some circumstances as well. Reference on in_array
is provided.
Upvotes: 2
Reputation: 1102
Are you looking for something like this?
Looping from 1 to 31 and checking if the post isset dynamically...
for($number = 1; $number < 31; ++$number) {
$image = "image" . $number;
if(isset($_POST[$image])){
//load mysql data associated with $image
}
}
Be aware that if you change the image names in your view it won't work. You have to respect the number sequence.
Upvotes: 0