Missouri State University Pattern Library

Input: Date

No notes defined.

<div id="div_date_input" class="form-group">
    <label class="control-label" for="id_date_input">Lorem ipsum dolor sit amet consectetur
        <input required type="date" name="Lorem ipsum dolor sit amet consectetur" id="id_date_input" placeholder class="form-control">
        <span id="ldp-help-date_input" class="help-block">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Id eum ipsam consequuntur excepturi mollitia cupiditate, exercitationem sequi. Aperiam, id consequatur?</span>
</div>
 
<div id="div_{{name}}" class="form-group">
  {{#if label}}
    <label class="control-label" for="id_{{name}}">{{label}}
    {{#if required}}<span class="required" title="required">*</span>
    </label>  
  {{/if}}
  <input required type="{{type}}" name="{{label}}" id="id_{{name}}" placeholder class="form-control">
    {{#if date}}
      <script type="text/javascript">
      var OUC = OUC || {};
      OUC.dateTimePickers = OUC.dateTimePickers || [];
      OUC.dateTimePickers.push({
      id: '#id_{{label}}',
      format: '{{date}}',
      default: '06/15/2023'});
      </script>
    {{/if}}
    {{#if description}}
      {{> @mc-description}}
    {{/if}}
   {{/if}} 
</div>
 
{
  "pageId": 1,
  "label": "Lorem ipsum dolor sit amet consectetur",
  "description": "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Id eum ipsam consequuntur excepturi mollitia cupiditate, exercitationem sequi. Aperiam, id consequatur?",
  "type": "date",
  "name": "date_input",
  "maxLength": null,
  "size": null,
  "required": null,
  "disabled": null,
  "ariaLabel": null
}