I am creating a search interface, letting the user chose a row from a table with anything between 1 - 500 rows and find entries similar to the one selected.
Right now, I have a form of checkboxes for each row and get the values directly in php.
part of index.php
<table>
<tr><!-- several tds -->
<td><form action="pfile.php" name="findsimilar1" method="post">
<input type="checkbox" name="color" value="red">
<!-- several more checkboxes with attributes -->
<input type="checkbox" name="darkness" value="8">
<input type="submit" name="submit_b">
</form></td></tr>
<tr><!-- several tds-->
<td><form action="pfile.php" name="findsimilar2" method="post">
<input type="checkbox" name="color" value="blue">
<!-- several more checkboxes with attributes -->
<input type="checkbox" name="darkness" value="2">
<input type="submit" name="submit_b">
</form></td></tr>
<tr><!-- several tds-->
<td><form action="pfile.php" name="findsimilar3" method="post">
<input type="checkbox" name="color" value="green">
<!-- several more checkboxes with attributes -->
<input type="checkbox" name="darkness" value="5">
<input type="submit" name="submit_b">
</form></td></tr></table>
part of pfile.php:
if(isset($_POST['submit_b'])){
if(isset($_POST['color'])){
$c = $_POST['color'];
}
if(isset($_POST['darkness'])){
$d = $_POST['darkness'];
}
}
But only the values of the first/last entry get send. I already - after reading answers to similar questions - changed the name of the forms to be unique by appending the rownumber to the name, but this does not change the behaviour.
The user may click all, one or several of the checkboxes.
I want only the values of the form whose button was clicked to be send. php-version: 5.3.3 Browser: Firefox ESR 38.6.0
Any pointers into the right direction or what I might have missed?
Is Jquery maybe the better way to go?
Edits:
Either add method="POST"
(your table a bit beautified)
<table>
<tr><th style="text-align:left">color</th><th>darkness</th><th> </th></tr>
<tr><!-- several tds -->
<form action="pfile.php" name="findsimilar1" method="POST">
<td><input type="checkbox" name="color" value="red">red</input></td>
<td><input type="checkbox" name="darkness" value="8">active</input></td>
<td><input type="submit" name="submit_b" /></td>
</form>
</tr>
<tr><!-- several tds-->
<form action="pfile.php" name="findsimilar2">
<td><input type="checkbox" name="color" value="blue">blue</input></td>
<td><input type="checkbox" name="darkness" value="2">active</input></td>
<td><input type="submit" name="submit_b" /></td>
</form>
</tr>
<tr><!-- several tds-->
<form action="pfile.php" name="findsimilar3">
<td><input type="checkbox" name="color" value="green">green</input></td>
<td><input type="checkbox" name="darkness" value="5">active</input></td>
<td><input type="submit" name="submit_b" /></td>
</form>
</tr>
</table>
...or change $_POST to $_REQUEST (which covers both GET and POST methods)
Btw: always initialize variables and do not let them "unset" if you later will access them.
if(isset($_REQUEST['submit_b'])){
$color = isset($_REQUEST['color']) ? $_REQUEST['color'] : false;
$darkness = isset($_REQUEST['darkness']) ? $_REQUEST['darkness'] : false;
if ($color !== false) && ($darkness !== false) {
// Do anything...
}
} else {
// Nothing to do...
}
Using jQuery you can also test it on this new fiddle
HTML and JS
<form action="pfile.php" method="post" id="findsimilar">
<table>
<tr>
<td>
<input type="checkbox" name="ckColor" value="red">
<input type="checkbox" name="ckDarkness" value="8">
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="ckColor" value="blue">
<input type="checkbox" name="ckDarkness" value="2">
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="ckColor" value="green">
<input type="checkbox" name="ckDarkness" value="5">
</td>
</tr>
</table>
<input type="hidden" name="color" />
<input type="hidden" name="darkness" />
<input type="submit" name="submit_b">
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script type="text/javascript">
var chkDarkness= $('#findsimilar input[name="ckDarkness"]');
var chkColors=$('#findsimilar input[name="ckColor"]');
var getGolor=$('input[name="color"]');
var getDarkness=$('input[name="darkness"]');
chkColors.on('click',function(){
var el=$(this);
var elDark=el.parent().find('input[name="ckDarkness"]');
chkDarkness.not(elDark).prop('checked',false);
if (el.is(':checked')){
chkColors.not(el).prop('checked',false);
getGolor.val(el.val());
if (!elDark.is(':checked'))
getDarkness.val('');
} else {
getGolor.val('');
if (!elDark.is(':checked'))
getDarkness.val('');
}
});
chkDarkness.on('click',function(){
var el=$(this);
var elCol=el.parent().find('input[name="ckColor"]');
getDarkness.val('');
chkDarkness.not(el).prop('checked',false);
chkColors.not(elCol).prop('checked',false);
if (el.is(':checked'))
getDarkness.val(el.val());
if (!elCol.is(':checked'))
getGolor.val('');
})
</script>
PHP
if(isset($_POST['submit_b'])){
if(isset($_POST['color']))
$c = $_POST['color'];
if(isset($_POST['darkness']))
$d = $_POST['darkness']
}