I have a form located here:
http://f14.co/auto-search/Test/
You'll see in the code that there is a form element about halfway down:
</div>
<form method="post" class="form-horizontal" id="final_form" action="send_mail.php">
<input type="hidden" name="template" id="template" value="Buyers" />
<div class="modal-body" >
<div id="lead_info_1">
<div class="input select">
<div class=""></div>
<div class="span-4 step-2-dropdown append-bottom control-group">
<select class="span3 required" name="minPrice" id="minPrice">
About 1/4 of the way down there is a checkbox that I need to be inside the form to work with send_mail.php:
<div class="sold"></div>
<div class="form">
<h2>Search for your dream home<br />
and save now!</h2>
<legend>Which Areas are you interested in?</legend>
<div class="areas row-fluid" style="text-align:left !important;">
<div class='span5' style='margin-left:0px !important;'>
<label>
<input type="checkbox" name="arrayValue[]" id="area[0]" value="test" style='margin-top:-5px !important;'> test</label>
</div>
</div>
<input type="button" onclick="jQuery('#myModal').modal('show')" value="CONTINUE" />
However, if I move the form element above the checkboxes, the error checking (the form turns red if values aren't filled out), goes away.
Anyone know how to preserve the error checking? I can't for the life of me figure out what I'm doing wrong. Not sure if this is a page code problem or a CSS issue.