Validating forms to work on safari html/php/javascript

Question

i have a piece of code that i have to run through jQuery in order to make the form validate on safari since HTML5 validation does not work for safari browser. I attempted this code and it works but for the services, it doesnt work. Meaning it does not validate that one of the services checkbox has to be selected to continue. Any help? Thanks in advance

Code:

      Please choose the services you require<br><br>

              <form method="post" action="includes/guestorder.php" name="GuestForm" id="GuestForm" autocomplete="off" onsubmit="return validate();">

     <input name="services[]" type="checkbox" value="electrician"> Electrician<br>

      <input name="services[]" type="checkbox" value="health"> Health Technician<br>


      <input name="services[]" type="checkbox" value="ac"> Air Conditioning Technician<br>

            <input name="services[]" type="checkbox" value="computer"> Computer Technician<br>


      <input name="services[]" type="checkbox" value="satelite"> Satelite Service Technician<br>


      <input name="services[]" type="checkbox" value="blacksmith"> Blacksmith<br>


            <input name="services[]" type="checkbox" value="aliminium"> Aliminium Technician<br>

      <input name="services[]" type="checkbox" value="carpenter"> Carpenter<br>


            <input name="services[]" type="checkbox" value="housedecor"> Interior Designer & House Decorations<br>

                        <input name="services[]" type="checkbox" value="gardener"> Gardener<br>


                     <input name="services[]" type="checkbox" value="ceramics"> Ceramics<br>


                     <input name="services[]" type="checkbox" value="painter"> Painter<br>

                                          <input name="services[]" type="checkbox" value="nurse"> Nurse<br>

                       <input name="services[]" type="checkbox" value="delivery"> Delivery Service<br>

                         <input name="services[]" type="checkbox" value="helpers"> House Helpers (By hours)<br>

                                          <input name="services[]" type="checkbox" value="movedecor"> House Furniture Transportation<br>

                                                          <input name="services[]" type="checkbox" value="phones"> Phone Technician<br>

                                         <input name="services[]" type="checkbox" value="valet"> Valet<br>

                     <input name="services[]" id="services[]" type="checkbox" value="carw"> Car Wash<br>

         <?php



         echo "<br><fieldset>";
         echo "<legend>Your Details & Information</legend>";
         echo "Area:*<br /> <input name='area' id='area' type='text' required /><br />";
         echo "Block:*<br /> <input name='block' id='block' type='text' required /><br />";
         echo "Street Address:*<br /> <input name='streetaddress' id='streetaddress' type='text' required /><br />";
         echo "Avenue:<br /> <input name='avenue' id='avenue' type='text'><br />";
         echo "Building/House:*<br /> <input name='building' id='building' type='text' required /><br />";
         echo "Floor:<br /> <input name='floor' id='floor' type='text'><br />";
         echo "Apartment:<br /> <input name='apartment' id='apartment' type='text'><br />";
                  ?>
         What time do you need this service delivered?*<br> <input name="time" type="text" required><br>
         <?php
         echo "Phone Number:*<br /> <input name='phone' id='phone' type='text' pattern='[0-9]{8}' required /><br />"; 

                  echo "</fieldset>";
         ?>
         <br>


<input type="checkbox" name="checkbox" value="checkbox" id="checkbox" required />&nbsp;&nbsp;By checking this box, i have agreed to the <a href="/terms.php" style="color: #FFFFFF">Terms & Conditions</a>

<br>
<br>


         <input type="submit" class="submit" id="submit" value="Submit"><input type="reset" value="Reset"><br>
</form>

 <script>
     function validate(){

               if(!(document.GuestForm.services[].checked) )
     {
        alert( "Please choose a service" );
        return false;
     }
          if( document.GuestForm.area.value == "" )
     {
        alert( "Please provide your area" );
        return false;
     }

                    if(document.GuestForm.block.value == "")
     {
        alert( "Please provide your block number" );
        return false;
     }

          if( document.GuestForm.streetaddress.value == "" )
     {
        alert( "Please provide your street address" );
        return false;
     }  

                    if( document.GuestForm.building.value == "" )
     {
        alert( "Please provide your building/house number" );
        return false;
     }

                         if( document.GuestForm.time.value == "" )
     {
        alert( "Please provide the time you want the service" );
        return false;
     }

     if(document.GuestForm.phone.value == "")
     {
        alert( "Please provide your phone number" );
                return false;
     }

     if(! (document.GuestForm.checkbox.checked))
     {
        alert( "Please agree to the terms & conditions" );

        return false;
     }

     return true;
  }
  </script>

Answer 1

maybe this helps you:

html:

<form id="myForm">
    <input type="checkbox" name="test[]" value="1" />foo
    <input type="checkbox" name="test[]" value="2" />bar
    <input type="submit" />
</form>

js:

$('#myForm').submit(function(event) {
    if (!isChecked()) {
        console.log('bad');
        event.preventDefault();
        return;
    }

    console.log('good');
});



function isChecked() {
    return $('input:checkbox:checked').length > 0;
}

example:

http://jsfiddle.net/47zfd6o0/