2016-05-08 40 views
1

//我想要做的是让用户选择许多复选框。为了进行预订,用户必须选择至少一个座位号复选框(该复选框必须是一个或多个座位号复选框)。他们也可以选择儿童,轮椅或特殊饮食,但为了这样做,必须检查属于相应座位号的复选框。如果不是确认或弹出必须出现,说明必须检查座位号码。这意味着如果用户想要检查特殊饮食,轮椅或小孩,则必须检查座位号。如果用户单击提交按钮时没有选中任何复选框,则应该进行验证或弹出窗口,指出必须至少选择一个复选框。 THis is my current page layout如何创建只允许用户在选中前一个复选框时选中复选框的复选框验证?

这是我nextpage.php

<!DOCTYPE html> 
<head> 
<style> 

td{ 

    padding-top: 10px; 
    padding-left: 10px; 
    padding-right: 10px; 
    padding-bottom: 10px; 
} 
p{ 
font-size: 16px; 

} 
</style> 
<body> 
<?php 
// Start the session 
session_start(); 
?> 

<?php 

     $str = $_GET['Confirm']; 
     $array = (explode(",",$str)); 
     ?> 


<h1>Booking Details</h1> 

Flight Details: 
<table> 
    <tr> 
     <td> Route_no 
     </td> 
     <td><?php echo $array[0] ?> 
     </td> 
    </tr> 
    <tr> 
     <td> 
     To_city</td> 
     <td> <?php echo $array[1] ?> 
     </td> 
    </tr> 
    <tr> 
     <td> 
     From_city</td> 
     <td> <?php echo $array[2] ?> 
     </td> 
    </tr> 
    <tr> 
     <td> 
     Price</td> 
     <td> $<?php echo $array[3] ?> 
     </td> 
    </tr> 

</table> 

<?php 
// Set session variables 
$_SESSION["route_no"] = $array[0]; 
$_SESSION["to_city"] = $array[1]; 
$_SESSION["from_city"] = $array[2]; 
$_SESSION["price"] = $array[3]; 
echo "Session variables for this booking have been set."; 
?> 
<form action="Yourbookings.php" method="get"> 
<table> 
<tr> 
    <td>Seat #</td> 
    <td>Child </td> 
    <td>WheelChair</td> 
    <td>Special Diet</td> 
</tr> 
<tr> 
    <td>Seat 1 <input type="checkbox" name="seat1" value="2"> </td> 
    <td> <input type="checkbox" name="Child" value="Child1"> </td> 
    <td> <input type="checkbox" name="WheelChair" value="WheelChair1"> </td> 
    <td> <input type="checkbox" name="Special Diet" value="SpecialDiet1"> </td> 
</tr> 
<tr> 
    <td>Seat 2 <input type="checkbox" name="seat2" value="1"> </td> 
    <td> <input type="checkbox" name="Child2" value="Child2"> </td> 
    <td> <input type="checkbox" name="WheelChair2" value="WheelChair2"> </td> 
    <td> <input type="checkbox" name="Special Diet2" value="SpecialDiet2"> </td> 
</tr> 
<tr> 
    <td>Seat 3 <input type="checkbox" name="seat3" value="seat3"> </td> 
    <td> <input type="checkbox" name="Child3" value="Child3"> </td> 
    <td> <input type="checkbox" name="WheelChair3" value="WheelChair3"> </td> 
    <td> <input type="checkbox" name="Special Diet3" value="SpecialDiet3"> </td> 
</tr> 
<tr> 
    <td>Seat 4 <input type="checkbox" name="seat4" value="seat4"> </td> 
    <td> <input type="checkbox" name="Child4" value="Child14"> </td> 
    <td> <input type="checkbox" name="WheelChair4" value="WheelChair4"> </td> 
    <td> <input type="checkbox" name="Special Diet4" value="SpecialDiet4"> </td> 
</tr> 
<tr> 
    <td>Seat 5 <input type="checkbox" name="seat5" value="seat5"> </td> 
    <td> <input type="checkbox" name="Child5" value="Child5"> </td> 
    <td> <input type="checkbox" name="WheelChair5" value="WheelChair5"> </td> 
    <td> <input type="checkbox" name="Special Diet5" value="SpecialDiet5"> </td> 
</tr> 
</table> 

<?php 
$_SESSION["price"] = $array[3]; 


?> 

Total = $variable?? 


<input type="submit" name="Add booking" value="Add_booking"> 
</form> 



</body> 
</head> 
</html> 

回答

1

在我看来,忘掉所有的警报和这样的,只是使用阵列复选框键:

<tr> 
     <td>Seat 1</td> 
     <td><input type="checkbox" name="seat1[child]" value="1"></td> 
     <td><input type="checkbox" name="seat1[wheelchair]" value="1"></td> 
     <td><input type="checkbox" name="seat1[specialdiet]" value="1"></td> 
    </tr> 
    <tr> 
     <td>Seat 2</td> 
     <td><input type="checkbox" name="seat2[child]" value="1"></td> 
     <td><input type="checkbox" name="seat2[wheelchair]" value="1"></td> 
     <td><input type="checkbox" name="seat2[specialdiet]" value="1"></td> 
    </tr> 
    <tr> 
     <td>Seat 3</td> 
     <td><input type="checkbox" name="seat3[child]" value="1"></td> 
     <td><input type="checkbox" name="seat3[wheelchair]" value="1"></td> 
     <td><input type="checkbox" name="seat3[specialdiet]" value="1"></td> 
    </tr> 
    <tr> 
     <td>Seat 4</td> 
     <td><input type="checkbox" name="seat4[child]" value="1"></td> 
     <td><input type="checkbox" name="seat4[wheelchair]" value="1"></td> 
     <td><input type="checkbox" name="seat4[specialdiet]" value="1"></td> 
    </tr> 

提交后,您的阵列会看像这样:

Array 
(
    [seat1] => Array 
     (
      [child] => 1 
      [wheelchair] => 1 
     ) 

    [seat2] => Array 
     (
      [wheelchair] => 1 
     ) 

    [seat3] => Array 
     (
      [wheelchair] => 1 
      [specialdiet] => 1 
     ) 

    [seat4] => Array 
     (
      [child] => 1 
      [wheelchair] => 1 
      [specialdiet] => 1 
     ) 

    [Add_booking] => Add_booking 
) 

编辑:

根据您的澄清,你需要一些JavaScript(jQuery的):

演示:

https://jsfiddle.net/9e9embjt/

的JavaScript:

$(document).ready(function(){ 
    $(this).on('click',".seat_selector",function() { 
     var thisBtn  = $(this); 
     var isChk  = thisBtn.is(":checked"); 
     var thisWrap = thisBtn.parents('.seat_selector_wrap').find("input[type=checkbox]"); 
     if(isChk) 
      thisWrap.attr("disabled",false); 
     else { 
      thisWrap.attr("disabled",true); 
      thisBtn.attr("disabled",false); 
     } 

     var allSeats = $(".seat_selector"); 
     var disable  = true; 
     $.each(allSeats, function(k,v) { 
      if($(v).is(":checked")) { 
       disable = false; 
       return false; 
      } 
     }); 

     $("#submitter").attr('disabled',disable); 
    }); 
}); 

HTML:

<table> 
</tr> 
    <tr class="seat_selector_wrap"> 
    <td>Seat 1</td> 
    <td><input type="checkbox" name="seat1[seat]" value="1" class="seat_selector" /></td> 
    <td><input type="checkbox" name="seat1[child]" value="1" disabled /></td> 
    <td><input type="checkbox" name="seat1[wheelchair]" value="1" disabled /></td> 
    <td><input type="checkbox" name="seat1[specialdiet]" value="1" disabled /></td> 
</tr> 
<tr class="seat_selector_wrap"> 
    <td>Seat 2</td> 
    <td><input type="checkbox" name="seat2[seat]" value="1" class="seat_selector" /></td> 
    <td><input type="checkbox" name="seat2[child]" value="1" disabled /></td> 
    <td><input type="checkbox" name="seat2[wheelchair]" value="1" disabled /></td> 
    <td><input type="checkbox" name="seat2[specialdiet]" value="1" disabled /></td> 
</tr> 
<tr class="seat_selector_wrap"> 
    <td>Seat 3</td> 
    <td><input type="checkbox" name="seat3[seat]" value="1" class="seat_selector" /></td> 
    <td><input type="checkbox" name="seat3[child]" value="1" disabled /></td> 
    <td><input type="checkbox" name="seat3[wheelchair]" value="1" disabled /></td> 
    <td><input type="checkbox" name="seat3[specialdiet]" value="1" disabled /></td> 
</tr> 
<tr class="seat_selector_wrap"> 
    <td>Seat 4</td> 
    <td><input type="checkbox" name="seat4[seat]" value="1" class="seat_selector" /></td> 
    <td><input type="checkbox" name="seat4[child]" value="1" disabled /></td> 
    <td><input type="checkbox" name="seat4[wheelchair]" value="1" disabled /></td> 
    <td><input type="checkbox" name="seat4[specialdiet]" value="1" disabled /></td> 
</tr> 
</table> 
<input type="submit" name="Add booking" value="Add_booking" id="submitter" disabled /> 
+0

必须有确认这是一个必须要 –

+0

你需要什么目的验证?检查是否所有5个座位都已关闭? – Rasclatt

+0

,以确保在单击add_submit按钮之前选择了至少一个座位号复选框,并且为了使用户选择econ和/或firstclass和或businessclass,与这三个复选框相对应的复选框(即,seatnumber)(即,同样的三个复选框行)必须先选择,以便用户可以选择三个复选框中的任何一个/如果您仍然不明白,请让我知道。 –

相关问题