<script> function process() { var studentAgree = document.getElementById("student-agree").checked; console.log(studentAgree); var parentAgree = document.getElementById("adult-agree").checked; console.log(parentAgree); if (studentAgree && parentAgree) { document.getElementById('form').hidden = false console.log("WOOHOO"); } else { document.getElementById('form').hidden = true console.log("NEGATORY"); } } document.addEventListener('DOMContentLoaded', process); </script> <div class="m-4"> <div class="p-2"> <input type="checkbox" name="student-agree" id="student-agree" onclick="process()" /> <label for="student-agree">I agree to the above</label> </div> <div class="p-2"> <input type="checkbox" name="adult-agree" id="adult-agree" onclick="process()" /> <label for="adult-agree">Parent agrees to the above</label> </div> </div> <div class="h-12" style="display: flex;"></div> <iframe id="form" class="mt-form w-full h-screen" src="https://tbl.tfcconnection.org/dashboard/#/nc/form/771dc7dc-9a82-49e4-abfe-0fd7b72281f2?embed" frameborder="0" style="background: transparent; border: 1px solid #ddd"> </iframe>