title: Angular Material md-datepicker and md-select validation
body: <p>I have a form with input fields, datepickers, and dropdowns. On submit, if the required input fields are not filled out, they are underscored with a red line. I would like the datepickers and dropdowns to also be underscored if not selected - at the moment they do nothing.</p>
  
  <p>Code:</p>
  
  <pre><code>  &lt;div class="input-section-title"&gt;Information&lt;/div&gt;
  
    &lt;div layout="row"
         layout-align="start start"&gt;
  
      &lt;md-datepicker id="date"
                     ng-model="vm.submissionDate"
                     md-placeholder="Date*"
                     required&gt;&lt;/md-datepicker&gt;
  
      &lt;md-input-container class="form-input-container padded-input md-block"
                          flex-gt-sm=""&gt;
        &lt;label&gt;Type*&lt;/label&gt;
        &lt;md-select id="information-type"
                   ng-model="vm.type"
                   required&gt;
          &lt;md-option ng-repeat="type in vm.dropdowns.types"
                     value="{{type}}"&gt;
            {{type}}
          &lt;/md-option&gt;
        &lt;/md-select&gt;
      &lt;/md-input-container&gt;
  
      &lt;md-input-container class="form-input-container"
                          flex="15"&gt;
        &lt;label&gt;NVRA*&lt;/label&gt;
        &lt;md-select id="information-nlba"
                   ng-model="vm.code"
                   required&gt;
          &lt;md-option ng-repeat="code in vm.dropdowns.codes"
                     value="{{code}}"&gt;
            {{code}}
          &lt;/md-option&gt;
        &lt;/md-select&gt;
      &lt;/md-input-container&gt;
  
    &lt;/div&gt;
  
    &lt;div class="input-section-title"&gt;Personal Information&lt;/div&gt;
  
    &lt;div layout="row" layout-align="start start"&gt;
  
      &lt;md-input-container class="form-input-container" flex&gt;
        &lt;label&gt;Last Name*&lt;/label&gt;
        &lt;input id="personal-information-last-name"
               ng-model="vm.vitals.last" required&gt;
      &lt;/md-input-container&gt;
  
      &lt;md-input-container class="form-input-container padded-input" flex&gt;
        &lt;label&gt;First Name*&lt;/label&gt;
        &lt;input id="personal-information-first-name"
               ng-model="vm.vitals.first" required&gt;
      &lt;/md-input-container&gt;
  
      &lt;md-input-container class="form-input-container padded-input" flex&gt;
        &lt;label&gt;Middle Name&lt;/label&gt;
        &lt;input id="personal-information-middle-name"
               ng-model="vm.vitals.middle"&gt;
      &lt;/md-input-container&gt;
  
      &lt;md-input-container class="form-input-container" flex="15"&gt;
        &lt;label&gt;Suffix&lt;/label&gt;
        &lt;md-select id="personal-information-suffix"
                   ng-model="vm.vitals.suffix"&gt;
          &lt;md-option ng-repeat="suffix in vm.dropdowns.suffixes"
                     value="{{suffix}}"&gt;
            {{suffix}}
          &lt;/md-option&gt;
        &lt;/md-select&gt;
      &lt;/md-input-container&gt;
  
    &lt;/div&gt;
  </code></pre>