问题
I have here a code wherein I have an array of checkbox populated with mysql data through a query. I can successfully submit the value of the checked checkbox into a table in a database. But what I want to do is to save it according to the sequence the checkbox was checked by the user. I was told that I can achieve this through javascript but unfortunately, I'm not familiar with javascript at all. If possible, can you provide steps on achieving this through PHP only? If not, can you please guide me on how to achieve this using javascript since I'm a newbie. Here's my sample code to let you imagine what I'm trying to do..
<?php
require("aacfs.php");
echo"<div align= center >
<table width=300 border= 1 align= right><tr><th align=center bgcolor=silver><font face=consolas>Choose Itinerary</font></th></tr>
<tr>
<td></br>
<form method=post>";
$result=mysql_query(" select * from itinerary group by location");
$y=mysql_affected_rows();
for($i=0;$i<$y;$i++)
{$row=mysql_fetch_array($result);
$pr=$row['icode'];
$n=$row['location'];
$l=$row['btime'];
echo"<table border=1 align=center width=250>
<tr><td width=15><input name=prod[] type=checkbox value='$pr'></td><td>$n</td></tr>
</table>";
$t=$_POST[prod];
}
echo"</td></tr></table>";
echo"
<table width= 664 border= 1 align= left >
<tr><td height= 282 ><p align= center class= style77>
<p align= right ><h4>$d</h4></p>
<p align= center ><font face=consolas><b>Itinerary List</b></font></p>
<p align=center><font face=consolas>To change your itinerary list, choose again.</font></p>
<br>
<center><input name=add type= submit value='Add to Itinerary List'></center>
<br>
<table width=654 border= 1>
<tr bgcolor = silver align=center>
<td>Itinerary</td>
<td>Block Time</td>
</tr></form>";
if(isset($_POST['add']))
{
if(isset($_POST[prod]))
{ foreach($t as $k)
{$result=mysql_query("select * from itinerary where icode='$k'");
$y=mysql_affected_rows();
for($x=0;$x<$y;$x++)
{$row=mysql_fetch_array($result);
$r=array($row['icode']);
$n=$row['location'];
$p=$row['btime'];
echo"<form method=post><tr>
<td>$n</td>
<td>$p</td>
</tr>";
$a=$_POST[pro];
$stat1='Not Submitted';
foreach($r as $a=>$l)
{
$kdot=mysql_query("select max(reservno) as 'maxr' from reservation") or die(mysql_error());
$row2=mysql_fetch_array($kdot);
$fi=$row2['maxr'];
mysql_query("insert into location_list(reservno, icode, location, status) values('$fi', '$l', '$n', '$stat1')") or die(mysql_error());
}
}}}
}
Clarifications are most welcome. Hope you can help me! Thanks a lot!
回答1:
You create an hidden input with your checboxes, then when you submit the form you will have the $_POST['sequence'] with all your clicks in order:
<input id="sequence" name="sequence" />
<input type="checkbox" class="check" name="checkbox1" value="checkbox1">
<input type="checkbox" class="check" name="checkbox2" value="checkbox2">
<input type="checkbox" class="check" name="checkbox3" value="checkbox3">
<input type="checkbox" class="check" name="checkbox4" value="checkbox4">
Then you bind clicks on every checkbox with class check in this example
var windowOnload=window.onload||function(){};window.onload=function(){windowOnload();};
window.onload = function(){
var all = document.getElementsByTagName("input");
for (var i=0;i<all.length;i++) {
if(all[i].className == 'check'){
all[i].onclick = inputClickHandler;
}
}
};
function inputClickHandler(e){
e = e||window.event;
var inputElm = e.target||e.srcElement;
var text = inputElm.value;
var target = document.getElementById('sequence');
if(inputElm.checked == true){
if(target.value == ''){
target.value = text;
} else {
target.value = target.value+','+text;
}
} else {
var textToSearch = text+',';
var textAlternative = ','+text;
var regex = new RegExp( '\\b' + textToSearch + '\\b' );
var regex2 = new RegExp( '\\b' + textAlternative + '\\b' );
if(regex.test( target.value )){
target.value = target.value.replace(textToSearch, '');
} else if(regex2.test( target.value )){
target.value = target.value.replace(textAlternative, '');
} else {
target.value = target.value.replace(text, '');
}
}
}
You can achieve this with using jQuery also (it's more cleaner and reliable):
$(window).load(function(){
$('.check').on('click', function(){
if($(this).attr('checked')){
if($('#sequence').val() == ''){
$('#sequence').val($(this).val());
} else {
$('#sequence').val($('#sequence').val()+','+$(this).val());
}
} else {
var targetValue = $('#sequence').val();
var textToSearch = $(this).val()+',';
var textAlternative = ','+$(this).val();
var regex = new RegExp( '\\b' + textToSearch + '\\b' );
var regex2 = new RegExp( '\\b' + textAlternative + '\\b' );
if(regex.test( targetValue )){
$('#sequence').val(targetValue.replace(textToSearch, ''));
} else if(regex2.test( targetValue )){
$('#sequence').val(targetValue.replace(textAlternative, ''));
} else {
$('#sequence').val(targetValue.replace($(this).val(), ''));
}
}
});
});
回答2:
Got the detection of checked checkbox sequence through this code:
<script type="text/javascript">
<!--
$(document).ready(function(){
var array = [];
$("input[type=button]").click(function(){
for (var i = 0; i < array.length; i++){
if (array[i] == $(this).attr('value')){
array.splice(i, 1);
}
}
alert(array.length);
});
$('input[type="checkbox"]').click(function(){
if ($(this).attr('checked')){
// Add the new element if checked:
array.push($(this).attr('value'));
//alert(array2.push($(this).attr('name')));
}
else{
// Remove the element if unchecked:
for (var i = 0; i < array.length; i++){
if (array[i] == $(this).attr('value')){
array.splice(i, 1);
}
}
}
$("#result").show(function(){
$(this).val("");
for (var i = 0; i < array.length; i++){
$(this).val($(this).val() + " " + array[i]+ "\n");
}
});
});
});
//-->
</script>
I'm binding it in my checkbox.
$result=mysql_query(" select * from itinerary group by location");
$y=mysql_affected_rows();
for($i=0;$i<$y;$i++)
{$row=mysql_fetch_array($result);
$pr=$row['icode'];
$n=$row['location'];
$l=$row['btime'];
echo"<table border=1 align=center width=250>
<tr><td width=15>
<input type='checkbox' value='$n -> $l' id='cb1'>
</td><td>$n</td><td width=4>$l</td></tr>
</table>";
Then output it in a textarea.
<textarea name=resulta id='result' style='height:200px; width:350px' disabled='disabled'></textarea>
I can save it in my database through this:
echo "<form><center><input type=submit name='pindot' value='Gora Men~'></center></form>";
$val=$_POST['resulta'];
if (isset($_POST['pindot']))
{
$lines = explode("\n", $val);
foreach ($lines as $line) {
// $line here is a string
// build a query based on it and execute it
mysql_query("insert into postflight (sample_lang) values ('$line')") or die(mysql_error());
};
}
Thank you all for your help! God bless!
来源：https://stackoverflow.com/questions/12189152/identify-checked-checkbox-sequence-then-save-to-mysql-database