0

I have created a Lightning Component that will update a custom field whenever a button is clicked.

I want the button to be hidden when {!Go_No_Go_Question__c} is blank.

Right now, the button is disabling but it is disabling when the {!Go_No_Go_Question__c} has a value.

See code below

APEX:

public class addGNGQuestion {

    @AuraEnabled
    public static void updateChk(String key){
        Opportunity acc = [SELECT Id, Name, Submit_Go_No_Go_Question__c, Go_No_Go_Question__c FROM Opportunity WHERE Id=:key];  
        if(acc.Go_No_Go_Question__c == null){
            acc.Submit_Go_No_Go_Question__c = true;
        }
        UPDATE acc;
    }


    @AuraEnabled
    public static boolean getOppty(String key){
        Opportunity acc = [SELECT Id, Name, Submit_Go_No_Go_Question__c, Go_No_Go_Question__c FROM Opportunity WHERE Id=:key];  
        if(acc.Go_No_Go_Question__c!=null){
        return true;
        }else{
        return false;
        }
    }
}

Component

<aura:component controller="addGNGQuestion"
                implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >


     <aura:attribute name="opp" type="boolean"/>
     <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
    <aura:handler event="force:refreshView" action="{!c.isRefreshed}" />
    <div class="slds-align_absolute-center" style="height:12rem">
    <lightning:button variant="brand" 
                      label="Add Go-No Go Question" 
                      onclick="{!c.updateCheck}" 
                       aura:id="disablebuttonid" disabled="{!v.opp}"/> 
        </div>
</aura:component>

Controller

({

     doInit : function(component, event) {
         var action = component.get("c.getOppty");
                 action.setParams({ key :component.get("v.recordId") });

         action.setCallback(this, function(a) {
             component.set("v.opp", a.getReturnValue());
         });
         $A.enqueueAction(action);
     },

    updateCheck : function(component, event, helper) {
        var rid = component.get("v.recordId");
        var action = component.get("c.updateChk");
        action.setParams({key : rid});
        action.setCallback(this, function(response) {
            var state = response.getState();


            if (state === "SUCCESS") {
                component.set("v.opp",true );
                $A.get('e.force:refreshView').fire();  
            }
            else if (state === "ERROR") {
                var errors = response.getError();
                if (errors) {
                    if (errors[0] && errors[0].message) {
                        console.log("Error message: " + 
                                    errors[0].message);
                    }
                } 
                else {
                    console.log("Unknown Error");
                }
            }
        });
        $A.enqueueAction(action);
    },

    isRefreshed: function(component, event, helper) {
        location.reload();
    },
})

Also, I understand that there is no Hidden attribute as per this link, so for the meantime I used the Disabled attribute. I would like to know if there is a workaround for this? Also I want the button to be disabled/hidden when !Go_No_Go_Question__c} is blank.

Any help is much appreciated

Update

Component

<aura:component controller="addGNGQuestion"
                implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >


     <aura:attribute name="opp" type="boolean"/>
     <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
    <aura:handler event="force:refreshView" action="{!c.isRefreshed}" />
    <aura:if isTrue="{!v.opp}">
    <div class="slds-align_absolute-center" style="height:12rem">
    <lightning:button variant="brand" 
                      label="Add Go-No Go Question" 
                      onclick="{!c.updateCheck}" 
                      aura:id="disablebuttonid"  disabled="{!v.opp}"/>
        </div>
        </aura:if>
</aura:component>

Apex:

public class addGNGQuestion {

    @AuraEnabled
    public static void updateChk(String key){
        Opportunity acc = [SELECT Id, Name, Submit_Go_No_Go_Question__c, Go_No_Go_Question__c FROM Opportunity WHERE Id=:key];  
        if(acc.Go_No_Go_Question__c == null){
            acc.Submit_Go_No_Go_Question__c = true;
        }
        UPDATE acc;
    }


    @AuraEnabled
    public static boolean getOppty(String key){
        Opportunity acc = [SELECT Id, Name, Submit_Go_No_Go_Question__c, Go_No_Go_Question__c FROM Opportunity WHERE Id=:key];  
    if(acc.Go_No_Go_Question__c == ''||acc.Go_No_Go_Question__c == null){
    return true;
    }else{
    return false;
    }
}

The result is, without a record or Go_No_Go_Question__c being blank, the button is showing but it is disabled. enter image description here

With a record, the button is missing. enter image description here

My goal is when Go_No_Go_Question__c has a value, the button is missing. When Go_No_Go_Question__c is blank the button will be Enabled and visible.

  • I presume Go_No_Go_Question__c is a checkbox? – sfdcfox Jun 5 '19 at 5:29
  • It's a Lookup field. The Submit_Go_No_Go_Question__c is the checkbox – Naofumi Kun Jun 5 '19 at 5:38
2

You can use aura:if to render/unrender the button entirely. That might look like this:

<aura:if isTrue="{!v.opp}">
  <div class="slds-align_absolute-center" style="height:12rem">
    <lightning:button variant="brand" 
                      label="Add Go-No Go Question" 
                      onclick="{!c.updateCheck}" 
                      aura:id="disablebuttonid" disabled="{!v.opp}"/> 
  </div>
</aura:if>
  • Thanks for the answer, I tried inserting the aura:if the result is both button got disabled. I updated the Component code on my Question – Naofumi Kun Jun 5 '19 at 6:00
  • @NaofumiKun There's only one button in your code... so maybe we need to see more details. We'll be glad to help if you could just edit some more information in to your question. – sfdcfox Jun 5 '19 at 6:15
  • Please see my update and let me know if you need anymore details. – Naofumi Kun Jun 5 '19 at 6:26
0

Right now, the button is disabling but it is disabling when the {!Go_No_Go_Question__c}- has a value-- This is probably because in your code you are returning true when Go_No_Go_Question__c has a value , instead make it true when Go_No_Go_Question__c is equal to null.

@AuraEnabled
public static boolean getOppty(String key){
    Opportunity acc = [SELECT Id, Name, Submit_Go_No_Go_Question__c, Go_No_Go_Question__c FROM Opportunity WHERE Id=:key];  
    if(acc.Go_No_Go_Question__c == null){
    return true;
    }else{
    return false;
    }
}
  • Thanks Sahana, I tried including the code that you provided and just to make sure I made it acc.Go_No_Go_Question__c == ''||acc.Go_No_Go_Question__c == null but still no luck both scenarios the button is disabled – Naofumi Kun Jun 5 '19 at 6:02
  • Along with it try adding what sfdcfox has suggested. – Sahana Gowdar Jun 5 '19 at 6:04
  • Already did, latest code is included in the Question – Naofumi Kun Jun 5 '19 at 6:05
  • Remove disabled in Lightning button and check .. – Sahana Gowdar Jun 5 '19 at 6:46

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.