Learn more about Modern Campus forms
Form markup is generated with /xsl/_shared/forms.xsl
<style>
.ou-form-element {
position: absolute;
margin-left: -4000px;
}
</style>
<div class="ou-form">
<div id="status_test-form"></div>
<form id="form_test-form" name="contact-form" method="post" class="" autocomplete="off" data-ou-form-error="Oops%21%20Something%20went%20wrong.%20Please%20try%20again.">
<span class="hptest-form ou-form-element">
<label for="hptest-form" class="hptest-form">If you see this don't fill out this input box.</label>
<input type="text" id="hptest-form">
</span>
<div id="formgroup-suffix_test-form" class="form-group">
<fieldset class="input-group" id="id_suffix_test-form">
<legend class="control-label">Suffix</legend>
<div class="radio"><label><input type="radio" name="suffix" title="Dr." value="Dr.">Dr.</label></div>
<div class="radio"><label><input type="radio" name="suffix" title="Ms." value="Ms.">Ms.</label></div>
<div class="radio"><label><input type="radio" name="suffix" title="Mr." value="Mr.">Mr.</label></div>
<div class="radio"><label><input type="radio" name="suffix" title="Mx." value="Mx.">Mx.</label></div>
<div class="radio"><label><input type="radio" name="suffix" title="Mrs." value="Mrs.">Mrs.</label></div>
</fieldset>
</div>
<div id="formgroup-firstandlastname_test-form" class="form-group">
<label class="control-label" for="id_firstandlastname_test-form">First and Last Name<span class="required">*</span></label>
<input type="text" name="firstandlastname" id="id_firstandlastname_test-form" placeholder="" class="form-control" required="">
</div>
<div id="formgroup-emailaddress_test-form" class="form-group">
<label class="control-label" for="id_emailaddress_test-form">Email Address<span class="required">*</span></label>
<input type="email" name="emailaddress" id="id_emailaddress_test-form" placeholder="" class="form-control" required="">
</div>
<div id="formgroup-howdidyouhearaboutourprogram_test-form" class="form-group">
<label class="control-label" for="id_howdidyouhearaboutourprogram_test-form">How did you hear about our program?<span class="required">*</span></label>
<select class="form-control" name="howdidyouhearaboutourprogram[]" id="id_howdidyouhearaboutourprogram_test-form" required="" data-ddg-inputtype="unknown">
<option value="" disabled="" selected="">
Please Select
</option>
<option value="Search Engine">Search Engine</option>
<option value="TCU&#39;s Website">TCU's Website</option>
<option value="Social Media">Social Media</option>
<option value="Word of Mouth">Word of Mouth</option>
<option value="School Counselor/Adviser">School Counselor/Adviser</option>
<option value="College Fair">College Fair</option>
</select>
</div>
<div id="formgroup-date_test-form" class="form-group">
<label class="control-label" for="id_date_test-form">Date<span class="required">*</span></label>
<input type="text" name="date" id="id_date_test-form" class="form-control" required="">
<script type="text/javascript">
var OUC = OUC || {};
OUC.dateTimePickers = OUC.dateTimePickers || [];
OUC.dateTimePickers.push({
id: '#id_date_test-form',
format: 'date',
default: ''
});
</script>
</div>
<div id="formgroup-comments_test-form" class="form-group">
<label class="control-label" for="id_comments_test-form">Comments</label>
<textarea class="form-control" name="comments" id="id_comments_test-form" cols="200" style="width:auto;" rows="5" placeholder=""></textarea>
</div>
<div id="formgroup-fileupload_test-form" class="form-group">
<label for="id_fileupload" class="control-label">File Upload</label><br>
<input type="file" id="id_fileupload" name="fileupload" data-ou-error-message="Please%20use%20files%20that%20are%20less%20than%2025MB"><span class="help-block">You may send up to 25 MB in attachments.</span>
</div>
<button type="submit" id="btn_test-form" class="tcu-button _primary | button primary">Submit</button>
<button type="reset" id="clr_test-form" class="tcu-button _secondary | button secondary">Clear</button>
</form>
</div>