AAC Form Template

by freedawirl

HTML

<link rel="stylesheet" href="//capmetro.org/gage/styles/style.css">
<link rel="stylesheet" href="//capmetro.org/gage/vendor/bootstrap/css/bootstrap.css">
<script src="//capmetro.org/gage/vendor/bootstrap/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//capmetro.org/gage/styles/forms.css">
<div class="container">

<div id="form-wrap">
 <div id="form-title-row" class="row ">

  <div class="heading col-md-9">
   <h1 class="form-title">Application for appointment</h1>
  </div>

  <div class="col-md-3">
   <a class="back-link" href="/metroworks-business" title="Back to MertoWorks Business Section"> ‹ ‹ Go Back</a>
  </div>

 </div>
 <h3>
  Capital Metro’s Access Advisory Committee (AAC)
 </h3>
 <fieldset class="form-group row">
  <legend class="col-form-legend col-md-12">
   Customer Information
  </legend>
  <div class="col-xs-12 col-sm-4 col-md-4 req">
   <div>
    <input type="text" name="first_name" ektdesignns_nodetype="element" id="contact_name" ektdesignns_caption="First Name:" ektdesignns_name="first_name" title="Contact Name
Cannot be blank" placeholder="First Name" ektdesignns_validation="string-req" ektdesignns_datatype="string" ektdesignns_basetype="text" ektdesignns_schema="><xs:minlength value=&quot;1&quot; />" ektdesignns_validate="re:/\S+/" ektdesignns_invalidmsg="Cannot be blank" onblur="design_validate_re(/\S+/,this,'Cannot be blank');" class="design_textfield form-control input-sm">
   </div>
  </div>


  <div class="col-xs-12 col-sm-4 col-md-4 req">
   <div>
    <input type="text" name="last_name" ektdesignns_nodetype="element" id="last_name" ektdesignns_caption="Last Name:" ektdesignns_name="last_name" title="Last Name
Cannot be blank" placeholder="Last Name" ektdesignns_validation="string-req" ektdesignns_datatype="string" ektdesignns_basetype="text" ektdesignns_schema="><xs:minlength value=&quot;1&quot; />" ektdesignns_validate="re:/\S+/" ektdesignns_invalidmsg="Cannot be blank" onblur="design_validate_re(/\S+/,this,'Cannot be...

CSS

.req div:before {
    position: absolute;
    content: '*';
    color: red;
    left: -10px;
    top: 0;
}
.req div:after {
    display:none;
}

JavaScript

$(function () {
  $('[data-toggle="tooltip"]').tooltip()
})