2016-05-08 41 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)(即,同樣的三個複選框行)必須先選擇,以便用戶可以選擇三個複選框中的任何一個/如果您仍然不明白,請讓我知道。 –

相關問題