lightning:inputAddress field value access

Question

I have lightning component with lightning:inputAddress field and i need to access value of Address fields entered by user like Street, City etc. How can i access it?

below is my sample code:

Mark Up

   <aura:component controller="accountDataController" >
   <aura:attribute name="recordId" type="String" access="global"/>
   <aura:attribute name="account" type="Account" default="{sobjectType : 'Account'}" />
   <aura:handler event="c:billingEvent" action="{!c.doInit}" />
   <lightning:tabset >
    <lightning:tab >            
      <aura:set attribute="label">                                                  
       Address
      </aura:set>
     <lightning:layout multipleRows="true">
        <lightning:layoutItem padding="around-small" size="1" smallDeviceSize="3" mediumDeviceSize="6">        
            <lightning:inputAddress
                aura:id="billingAddress"
                addressLabel="Billing Address"
                streetLabel="Street"
                cityLabel="City"
                countryLabel="Country"
                provinceLabel="Province/State"
                postalCodeLabel="PostalCode"
                street="{!v.account.BillingStreet}"
                city="{!v.account.BillingCity}"
                province="{!v.account.BillingState}"
                country="{!v.account.BillingCountry}"
                postalCode="{!v.account.BillingPostalCode}"                     
            />
           </lightning:layoutItem>
         </lightning:layout>
         </lightning:tab>
    </lightning:tabset>

   <lightning:button label="Next" onclick="{!c.goNext}" />   
  </aura:component>

Controller

    ({
       doInit : function(component, event, helper) {
        var action = component.get("c.getAccount");

        action.setParams({"accountId": params.accountID});

        action.setCallback(this, function(response) {
            var state = response.getState();
            if(state === "SUCCESS") {
                component.set("v.account", response.getReturnValue());
            } else {
                console.log('Problem getting getBillingInfo, response state: ' + state);
            } 
        });            

        $A.enqueueAction(action);

       },
       goNext : function(component, event, helper) {
           //needs to access address values here.
       }
    })

Apex Controller

public with sharing class accountDataController {

    @AuraEnabled
    public static Account getAccount(Id accountId) {

        System.debug('Account ID = ' + accountId);

        String actQuery = 'SELECT id, AccountNumber, Name, Customer_Segment__c, Customer_Type__c, Customer_Sub_Type__c, ' +
                            'Sales_Channel__c, Market_Segment__c, Selling_Company__c,   Line_of_Business__c, Legal_Entity__c, ' +
                            'Currency__c, BillingStreet, BillingCity, BillingState, BillingPostalCode, BillingCountry, '+
                            'ShippingStreet, ShippingCity, ShippingState, ShippingPostalCode, ShippingCountry '+
                             'FROM Account WHERE Id =  \'' + String.escapeSingleQuotes(accountId)+ '\'';

        system.debug('getAccount Query = ' + actQuery);

        Account act = Database.query(actQuery);

        return act;        
    }
}

How can i access Address Fields value in Client Controller

Answer 1

you are binding your account Record attribute in lightning:inputAddress. If the user changes anything, it will automatically change the value in the account Record attribute. So, you can get Billing City value by component.get("v.account.BillingCity");.

If you don't want to bind your account record attribute, You can access values of Address fields by the following way.

component:

<lightning:inputAddress aura:id="billingAddress" addressLabel="Billing Address" streetLabel="Street" cityLabel="City" countryLabel="Country" provinceLabel="Province/State" postalCodeLabel="PostalCode" street="" city="" province="" country="" postalCode=""
/>

Controller: goNext : function(component, event, helper) { var inputAddress = component.find("billingAddress"); //finding Input Address by aura:id console.log('BillingCity', inputAddress.get("v.city")); }

Answer 2

In the controller, try using

 goNext : function(component, event, helper) {
       //needs to access address values here.
       alert(component.get('v.account.BillingCity'));
   }

This will give you the updated value what the user has entered and not the one which was fetched from the apex controller.