jquery if checkbox within parent div is checked then include php file? - php

Question

QUESTION UPDATED
pqq.php file:
I have a form like so:
<form>
{General form input here, i.e. name, address}
<php include 'form_general.php'; ?>
{Specific form input here, i.e. equipment type}
<php include 'infrastructure.php'; ?>
<div id="placeholder"></div>
<submit>
</form>
So in my infrastructure.php file I have the following checkboxes contained within a couple of parent divs like so:
infrastrucure.php file:
Plant Hire Category
<div class="option_select"><p class="select">Plant Hire</p></div>
<div class="option_underlay">
<div class="align"><p class="header">Access Platforms</p>
<div class="float_column3">
<input type="checkbox" name="option" id="option" class="group1" value="same">Option
<input type="checkbox" name="option" id="option" class="group1" value="same">Option
<br>
<input type="checkbox" name="option" id="option" class="group1" value="same">Option
<input type="checkbox" name="option" id="option" class="group1" value="same">Option
</div>
</div>
</div>
Travel Category
<div class="option_select"><p class="select">Travel</p></div>
<div class="option_underlay">
<div class="align"><p class="header">Planes</p>
<div class="float_column3">
<input type="checkbox" name="option" id="option" class="group2" value="same">Option
<input type="checkbox" name="option" id="option" class="group2" value="same">Option
<br>
<input type="checkbox" name="option" id="option" class="group2" value="same">Option
<input type="checkbox" name="option" id="option" class="group2" value="same">Option
</div>
</div>
</div>
JQUERY in my pqq.php file:
<script>
$(document).ready(function () {
$('input[name=option]').change(function () {
if($(this).hasClass('group1')) {
$('#placeholder').load("safety.php");
} else if($(this).hasClass('group2')) {
$('#placeholder').load("travel.php");
}
});
});
</script>
what I am trying to do is if a user checks any checkbox from the Plant Hire category then it includes my safety.php file in the form. Otherwise if a user selects any checkbox from my travel category then my travel.php file is included in the form?
Does anyone know a way I can do this using jquery or other methods?
Thanks,

Answer 1

First make div, where the loaded php file will be stored, in my code it would be <div id="placeholder"></div>, then for each group of checkboxes use the same class, in my code it's class group-1 and class group-2. Then use something like this:
$(document).ready(function () {
$('input[name=option]').change(function () {
if ($(this).hasClass('group1')) {
var length = $('.group1:checked').length;
if (length) {
$('#placeholder').load("safety.php");
} else {
$('#placeholder').html("");
}
} else if ($(this).hasClass('group2')) {
var length = $('.group2:checked').length;
if (length) {
$('#placeholder').load("travel.php");
} else {
$('#placeholder').html("");
}
}
});
});
Can more checkboxes be selected? Or only one? If only one, you should probably uncheck all other checkboxes in the code.
Also you have in your sample code multiple same IDs, which is not a good practice.