2016-05-08 1 views
1

// Was ich tun möchte ist, dass der Benutzer viele Checkboxen auswählen kann. Um eine Buchung vornehmen zu können, muss der Benutzer mindestens ein Kontrollkästchen für die Sitzplatznummer auswählen (dieses Kontrollkästchen muss eines oder mehrere der Kontrollkästchen für die Sitzplatznummer sein). Sie können auch ein Kind, einen Rollstuhl oder eine spezielle Diät auswählen, aber dazu muss das Kontrollkästchen, das zu der entsprechenden Sitznummer gehört, überprüft werden. Wenn es nicht eine Validierung oder ein Popup ist, muss angegeben werden, dass die Sitznummer überprüft werden muss. Das heißt, wenn ein Benutzer entweder eine spezielle Diät, einen Rollstuhl oder ein Kind überprüfen möchte, muss die Sitznummer überprüft werden. Wenn der Benutzer auf die Übermittlungsschaltfläche klickt, ohne dass Kontrollkästchen aktiviert sind, sollte eine Validierung erfolgen oder ein Popup mit der Angabe, dass mindestens ein Kontrollkästchen aktiviert sein muss. THis is my current page layoutWie kann ich eine Checkbox-Validierung erstellen, die es einem Benutzer nur erlaubt, ein Kontrollkästchen zu aktivieren, wenn ein vorheriges Kontrollkästchen ausgewählt ist?

das ist mein 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> 

Antwort

1

Meiner Meinung nach, vergessen Sie alle Warnungen und so, nur gruppierten Kontrollkästchen Tasten verwenden:

<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> 

Nach Vorlage Ihrer Array aussehen wird wie folgt aus:

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 
) 

EDIT:

Basierend auf Ihrer Klarstellung, müssen Sie einige Javascript (jQuery):

Demo:

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

da sein Validierung muss es ein Muss –

+0

Zu welchem ​​Zweck ist brauchen Sie Validierung? Um zu überprüfen, dass alle 5 Sitze abgehakt sind? – Rasclatt

+0

um sicherzustellen, dass mindestens ein Sitzplatz-Ankreuzfeld ausgewählt wird, bevor auf die Schaltfläche add_submit geklickt wird und damit der Benutzer econ und/oder firstclass und/oder businessclass das Kontrollkästchen (dh die Sitznummer) für diese drei Ankreuzfelder (dh die drei Ankreuzfelder) auswählt Zeile) muss zuerst ausgewählt werden, so dass der Benutzer dann eine der drei Checkboxen auswählen kann/wenn Sie immer noch nicht verstehen, lassen Sie es mich wissen. –

Verwandte Themen