p-dropdown support for HTML5 required attribute

[gatapia]

Currently 'requred' attribute is ignored on p-dropdown. It would be good if this was supported. Currently I have hacked this as follows:

# template
<p-dropdown [options]="list" [(ngModel)]="listid"></p-dropdown>
<input class='hidden-validator' type="number" [(ngModel)]="listid" required>

# component
listid;
list = [{value: '', label: 'Select...'}, {value: 1, label: '1'}];

# css
 /* 
hide it behind the dropdown component, the required 
  HTML5 pop up still shows which is good and the form
 is still marked as not valid 
*/
.hidden-validator {
  position: absolute;
  left: 600px;
  z-index: -1; 
}

[cghislai]

You can already use the required attribute on p-dropdown, although without the browser popup (which I assume is only displayed for HTML <input><select><textarea> components):

                    <p-dropdown ngControl="test"
                                #testControl="ngForm"
                                [options]="testOptions"
                                [(ngModel)]="testValue"
                                required>

                    </p-dropdown>
                    <div [hidden]="testControl.control?.status !== 'INVALID' ">
                      Value is required
                    </div>

[cagataycivici]

We have a hidden select tag inside, I'll add required to it.

[gatapia]

Thanks for this. Just a note for others: this requires that required="true" be set. requred on its own does not work.