Lightning Aura Components Developer Guide
jNote: This release is in preview. Features described here don’t become generally available until the latest general availability date that Salesforce announces for this release. Before then, and where features are noted as beta, pilot, or developer preview, we can’t guarantee general availability within any particular time frame or at all. Make your purchase decisions only on the basis of generally available products and features.
Forms, Fields, and Labels
Input components are designed to make it easy to assign labels to form fields. Labels build a programmatic relationship between a form field and its textual label. When using a placeholder in an input component, set the label attribute for accessibility.
Use lightning:input to create accessible input fields and forms. You can use lightning:textarea in preference to the <textarea> tag for multi-line text input or lightning:select instead of the <select> tag.
1<lightning:input name="myInput" label="Search" />If your code fails, check the label element during component rendering. The label element’s for attribute must match the value of the input control’s id attribute. Alternatively, wrap the label around an input. Input controls include <input>, <textarea>, and <select>.
Here’s an example of the HTML generated by lightning:input.
1<!-- Use label/for -->
2<label for="fullname">Enter your full name:</label>
3<input type="text" id="fullname" />
4
5<!-- Use an implicit label -->
6<label>Enter your full name:
7 <input type="text" id="fullname"/>
8</label>