corelogic long form

core-logic-long.html

<style>
  .required:after {
    color: #a0a0a0 !important;
  }

  .hide {
    display: none !important;
  }
</style>
<form action="{{the-corelogic-action-url}}" method="post" target="_blank" class="cta">
  <input type="hidden" name="unitNumber" data-swap-value="apartment.name"/>
  <input type="hidden" name="leaseTerm" value="{{location_setting.default_lease_term_months}}"/>
  <input type="hidden" name="moveInDate" data-swap-value="moveInDate"/>
  <input type="hidden" name="buildingId" data-swap-value="apartment.building"/>
  <h3>Personal Information</h3>

  <div class="form-field">
    <label for="firstName" class="required hide">First Name</label>
    <input type="text" id="p-first-name" class="p-name" name="firstName" maxlength="40" size="20"
           pattern="^[a-zA-Z\s\-]{0,40}$" placeholder="First Name*"
           title="40 characters max, letters, spaces, and hyphens only please" data-mapping="customer[first_name]"
           required>
  </div>

  <div class="form-field">
    <label for="lastName" class="required hide">Last Name</label>
    <input type="text" id="p-last-name" class="p-name" name="lastName" maxlength="40" pattern="^[a-zA-Z\s\-]{0,40}$"
           placeholder="Last Name*" title="40 characters max, letters, spaces, and hyphens only please"
           data-mapping="customer[last_name]" required>
  </div>

  <div class="form-field">
    <label for="phone" class="required hide">Phone Number</label>
    <input type="tel" id="p-tel" class="p-tel" name="phone"
           title="10 digit phone number, digits, hyphens, and parenthesis only please" maxlength="14"
           placeholder="Phone Number*" pattern="^[0-9 \-()]{1,14}$" data-mapping="customer[phone]" required>
  </div>

  <div class="form-field">
    <label for="email" class="required hide">Email</label>
    <input type="email" id="u-email" class="u-email" name="email"
           pattern="[a-zA-Z0-9._\-\+]+@[a-zA-Z0-9.\-]+\.[a-zA-Z]{2,6}" placeholder="Email*"
           data-mapping="customer[email]" required>
  </div>
  <input type="submit" class="floorplan-card-cta no-cta" value="Send"/>
  <span class="form-instruction">* Required Field</span>
</form>