Apex Code Development You need to sign in to do that
Don't have an account?
Laurie Drew Lightning Components Basics - Lightning Input field -How to make the field taller?
I am creating a custom lightning component to create an Account record and am wanting to make the field 'Description' taller. Images below will explain better what I am wanting to do. I want the input section of the field to be taller like this:
Instead of what I currently have:
I have been googling trying to figure out how to do this and apparenlty am not entering the correct key words to find a solution.
Here is the section of code for this portion of the screen:
<lightning:layout pullToBoundary="medium">
<lightning:layoutItem size="10" smallDeviceSize="5" mediumDeviceSize="5" padding="around-small">
<lightning:input label="Description" name="Description" value="{!v.AcctForm.Description}"/>
</lightning:layoutItem>
<lightning:layoutItem size="10" smallDeviceSize="5" mediumDeviceSize="5" padding="around-small">
<lightning:input label="Region" name="Region" value="{!v.AcctForm.Region__c }" />
</lightning:layoutItem>
</lightning:layout>
Would greatly appreciate any help that can be provided!
Instead of what I currently have:
I have been googling trying to figure out how to do this and apparenlty am not entering the correct key words to find a solution.
Here is the section of code for this portion of the screen:
<lightning:layout pullToBoundary="medium">
<lightning:layoutItem size="10" smallDeviceSize="5" mediumDeviceSize="5" padding="around-small">
<lightning:input label="Description" name="Description" value="{!v.AcctForm.Description}"/>
</lightning:layoutItem>
<lightning:layoutItem size="10" smallDeviceSize="5" mediumDeviceSize="5" padding="around-small">
<lightning:input label="Region" name="Region" value="{!v.AcctForm.Region__c }" />
</lightning:layoutItem>
</lightning:layout>
Would greatly appreciate any help that can be provided!
Please use lightning textarea tag for description instead of lightning input tag.
Use This like
<lightning:textarea name="input2" label="Textarea field with a predefined value" value="initial value"/>
Please try this code:
<lightning:layout pullToBoundary="medium" >
<lightning:layoutItem size="10" smallDeviceSize="5" mediumDeviceSize="5" padding="around-small">
<lightning:textarea name="Description" label="Description" value="{!v.AcctForm.Description}"/>
</lightning:layoutItem>
<lightning:layoutItem size="10" smallDeviceSize="5" mediumDeviceSize="5" padding="around-small">
<lightning:input label="Region" name="Region" value="{!v.AcctForm.Region__c }" />
</lightning:layoutItem>
</lightning:layout>
I hope it helps you.
Please let me know if you have any other query. If this solution is helpful then please mark it as Best Answer.
Thanks,
Ankit Rathor
All Answers
Please use lightning textarea tag for description instead of lightning input tag.
Use This like
<lightning:textarea name="input2" label="Textarea field with a predefined value" value="initial value"/>
Please try this code:
<lightning:layout pullToBoundary="medium" >
<lightning:layoutItem size="10" smallDeviceSize="5" mediumDeviceSize="5" padding="around-small">
<lightning:textarea name="Description" label="Description" value="{!v.AcctForm.Description}"/>
</lightning:layoutItem>
<lightning:layoutItem size="10" smallDeviceSize="5" mediumDeviceSize="5" padding="around-small">
<lightning:input label="Region" name="Region" value="{!v.AcctForm.Region__c }" />
</lightning:layoutItem>
</lightning:layout>
I hope it helps you.
Please let me know if you have any other query. If this solution is helpful then please mark it as Best Answer.
Thanks,
Ankit Rathor