Apex Code Development You need to sign in to do that
Don't have an account?
Sandeep TechAffinity How to do Alignment for this Aura component?
Hi Guys,
I have developed one Aura component which is like the Input text and "Send" button. Now I want to place SEND button beside the input text.
Please Help me.
Thank you
Sandeep.
I have developed one Aura component which is like the Input text and "Send" button. Now I want to place SEND button beside the input text.
<aura:component controller="ChatThreadHelper" implements="flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes" access="global" >
<aura:attribute name="Send" type="String" default="SEND"/>
<aura:attribute name="textvalue" type="String" default="" />
<aura:attribute name="messageList" type="List"/>
<aura:attribute name="recordId" type="string"/>
<!--<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>-->
<!--<lightning:card>-->
<div class="slds-form-element">
<label class="slds-form-element__label" for="textarea-id-01"></label>
<div class="slds-form-element__control">
<span onkeypress="{!c.keyCheck}">
<lightning:input name="input8" value="{! v.textvalue }" placeholder="type here" label="Message" />
</span>
</div>
<div>
<div class="slds-clearfix">
<lightning:buttonIcon iconName="utility:send" variant="bare" iconClass="dark" size="large" onclick="{! c.handleClick }" alternativeText="Send" title="Send" class="slds-float_right"/>
</div>
</div>
</div>
<!--</lightning:card>-->
</aura:component>
Please Help me.
Thank you
Sandeep.
please use below tested code:-
<aura:component implements="flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes" access="global" > <aura:attribute name="Send" type="String" default="SEND"/> <aura:attribute name="textvalue" type="String" default="" /> <aura:attribute name="messageList" type="List"/> <aura:attribute name="recordId" type="string"/> <!--<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>--> <!--<lightning:card>--> <div class="slds-form-element"> <label class="slds-form-element__label" for="textarea-id-01"></label> <div style ="width: 90%; float: left;"> <span onkeypress="{!c.keyCheck}"> <lightning:input name="input8" value="{! v.textvalue }" placeholder="type here" label="Message" /> </span> </div> <div> <div class="slds-clearfix" style ="margin-top: 6px;"> <lightning:buttonIcon iconName="utility:send" variant="bare" iconClass="dark" size="large" onclick="{! c.handleClick }" alternativeText="Send" title="Send" class="slds-float_right"/> </div> </div> </div> <!--</lightning:card>--> </aura:component>if you need any assistanse, Please let me know!!
Kindly mark my solution as the best answer if it helps you.
Thanks
Mukesh
All Answers
please use below tested code:-
<aura:component implements="flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes" access="global" > <aura:attribute name="Send" type="String" default="SEND"/> <aura:attribute name="textvalue" type="String" default="" /> <aura:attribute name="messageList" type="List"/> <aura:attribute name="recordId" type="string"/> <!--<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>--> <!--<lightning:card>--> <div class="slds-form-element"> <label class="slds-form-element__label" for="textarea-id-01"></label> <div style ="width: 90%; float: left;"> <span onkeypress="{!c.keyCheck}"> <lightning:input name="input8" value="{! v.textvalue }" placeholder="type here" label="Message" /> </span> </div> <div> <div class="slds-clearfix" style ="margin-top: 6px;"> <lightning:buttonIcon iconName="utility:send" variant="bare" iconClass="dark" size="large" onclick="{! c.handleClick }" alternativeText="Send" title="Send" class="slds-float_right"/> </div> </div> </div> <!--</lightning:card>--> </aura:component>if you need any assistanse, Please let me know!!
Kindly mark my solution as the best answer if it helps you.
Thanks
Mukesh