0

When I check which value is returned at the click of a button, null always returns to me. And when I click on the button to go to another page, it always goes to another page (it makes no difference what or not). How to fix it to go to the page only for the entered contactId, if it exists.

LoginPageComponent

<aura:component controller="Login" implements="force:appHostable,flexipage:availableForAllPageTypes" access="global" >
<aura:attribute name="contactId" type="id"/>
<aura:attribute name="login" type="String"/>
<aura:attribute name="password" type="String"/>

<aura:handler name="init" value="{!this}" action="{!c.getContact}"/>

            <p class="l"> Login </p>

            <ui:inputEmail class="email" value="{!v.login}" placeholder="Enter your username"/>  

            <p class="l"> Password </p>

            <ui:inputSecret class="password" value="{!v.password}" placeholder="Password" /> 

          <lightning:button class="slds-button slds-button_brand" label="Login" onclick="{!c.handleValueChange}" value="{!v.contactId}"/> 

LoginPageController

({
getContact : function(component) {
    var login = component.get('v.login');
    var password = component.get('v.password');
    var action = component.get("c.getContactId");
    action.setParams({
        login: login,
        password: component.get('v.password')
    });
    action.setCallback(this, function (response) {
         var state = response.getState();
         if (state === "SUCCESS") {
            component.set("v.contactId", response.getReturnValue());
         }
    });
    $A.enqueueAction(action);
},

 handleValueChange : function(component, event) {
    var evt = $A.get("e.force:navigateToComponent");
    evt.setParams({
        componentDef : "c:UserPage",
        componentAttributes: {
            contactId : event.getParam("value")
        }
    });
   evt.fire();
}
})

LoginClass

public with sharing class Login {

@AuraEnabled
public static Id getContactId (String login, String password){

    List<Contact> contacts = [Select Id FROM Contact Where Email =: login AND Password__c =: password];
    if (contacts.size() > 0 )
        return contacts[0].Id;
    else
        return null;
 }
}

I have been sitting with this for a long time and almost in despair. Can someone please help?

1

You have to first retrieve the value from the event in the controller and then navigate only if there is any value like below:

 handleValueChange : function(component, event) {

    var contactId = event.getSource().get("v.value");
    if(contactId){
        var evt = $A.get("e.force:navigateToComponent");
        evt.setParams({
            componentDef : "c:UserPage",
            componentAttributes: {
                contactId : contactId 
            }
        });
        evt.fire();     

    }
}
| improve this answer | |
1

The function {c.getContact} is being called on init at which point, the username/password fields are empty. Shouldn't it be called on a button click?

Component:

<lightning:button class="slds-button slds-button_brand" label="Login" onclick="{!c.getContact}" value="{!v.contactId}"/> 

Controller:

   ({
    getContact: function(component) {
        var login = component.get('v.login');
        var password = component.get('v.password');
        var action = component.get("c.getContactId");
        action.setParams({
            login: login,
            password: component.get('v.password')
        });
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                let contactIdFound = response.getReturnValue();
                component.set("v.contactId", contactIdFound);
                var evt = $A.get("e.force:navigateToComponent");
                evt.setParams({
                    componentDef: "c:UserPage",
                    componentAttributes: {
                        contactId: contactIdFound
                    }
                });
                evt.fire();
            }
        });
        $A.enqueueAction(action);
    },
    handleValueChange: function(component, event) {
        //moved to getcontact
    }
})
| improve this answer | |
0

Combining your two answers, here's what happened

getContact: function(component) {
    var login = component.get('v.login');
    var password = component.get('v.password');
    var action = component.get("c.getContactId");
    action.setParams({
        login: login,
        password: component.get('v.password')
    });
    action.setCallback(this, function(response) {
        var state = response.getState();
        if (state === "SUCCESS") {
            let contactIdFound = response.getReturnValue();
            component.set("v.contactId", contactIdFound);

            let contactId = component.get('v.contactId');

            if(contactId){
                var evt = $A.get("e.force:navigateToComponent");
                evt.setParams({
                    componentDef: "c:UserPage",
                    componentAttributes: {
                        contactId: contactId
                    }
                });
                evt.fire();
            }
        }
    });
    $A.enqueueAction(action);
},

Although, if you remove the attribute, it turns out the same

getContact: function(component) {
    var login = component.get('v.login');
    var password = component.get('v.password');
    var action = component.get("c.getContactId");
    action.setParams({
        login: login,
        password: component.get('v.password')
    });
    action.setCallback(this, function(response) {
        var state = response.getState();
        if (state === "SUCCESS") {
            let contactIdFound = response.getReturnValue();

            if(contactIdFound){
            var evt = $A.get("e.force:navigateToComponent");
            evt.setParams({
                componentDef: "c:UserPage",
                componentAttributes: {
                    contactId: contactIdFound
                }
            });
            evt.fire();
            }
        }
    });
    $A.enqueueAction(action);
},

Buttom:

<lightning:button class="slds-button slds-button_brand" label="Login" onclick="{!c.getContact}"/>

Now it goes only if the password and login match and exist in the table. But I'm not very sure if my own page opens for each contact? Anyway, thanks to everyone for the answers)

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.