0

I wrote a following code for component but it is not giving result as i expected, Component code

<aura:component >
    <aura:attribute name="parentOptions" type="List"/>
    <aura:attribute name="dependentPicklist" type="Object"/>
    <aura:attribute name="dependentOptions" type="List"/>
    <aura:attribute name="disabledPick" type="Boolean" default="true"/>

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

    <div class="slds-container--center slds-container--small slds-m-top--small">
        <div class="slds-form--stacked">

            <lightning:select name="parentPicklist" label="Profile" aura:id="parentPicklist" onchange="{!c.PickChange}">
                <option value="">None</option>
                <aura:iteration items="{!v.parentOptions}" var="p">
                    <option value="{!p.value}">{!p.text}</option>
                </aura:iteration>
            </lightning:select>

            <lightning:select name="dependentPicklist" label="PermissionSet" disabled="{!v.disabledPick}">
                <option value="">None</option>
                <aura:iteration items="{!v.dependentOptions}" var="d">
                    <option value="{!d.value}">{!d.text}</option>
                    <aura:if isTrue="{!v.dependentOptions == 'Report'}" >
                        <a href="https://map.baidu.com"> Visit baidu!</a>

                        </aura:if>  
                </aura:iteration>


            </lightning:select>




        </div>        
    </div>

</aura:component>

controller code

({
    doInit : function(component, event, helper) {
        var pVals = [
            {text:"Profile", value: "Profile"},
            {text:"PermissionList", value: "PermissionList"}
        ];

        var dPick = {

            "PermissionList" : [
                {text:"Report", value: "Report"},
                {text:"Dashboard", value: "Dashboard"},
                {text:"System", value: "Dashboard"}

            ]
        };

        component.set('v.parentOptions', pVals);
        component.set('v.dependentPicklist', dPick);

    },

    PickChange : function(component, event, helper) {
        var parentValue = component.find('parentPicklist').get('v.value');
        component.set('v.dependentOptions', component.get('v.dependentPicklist')[parentValue]);

        if(parentValue != '')
        component.set('v.disabledPick',false);
        else
        component.set('v.disabledPick',true);
    }
})

I want my will work but it doesnt give any output can anybody help here.

Thanks

5
  • Hi, and Welcome to SFSE. What exactly is not working? Any error messages? Can you explain the desired vs observed outcome? Aug 13, 2019 at 18:33
  • i want my <aura if > condition to validate when i select Report but nothing happens no error even when iam selecting Report same behaviour no error their i guess my <aura if> condition is not working Aug 13, 2019 at 18:34
  • Desired outcome want when my aura if condition is true i want href link to be displayed but nothing happens even when iam selecting Report if you check you will found. Aug 13, 2019 at 18:36
  • 1
    How are you expecting an <a> tag to display inside your <select> component? I am not sure if your code would even work at all. Aug 13, 2019 at 18:37
  • i want it to be displayed only link or whatever the selection ill give once my condition validates true for aura if. code works fine but iam not sure for this <aura if > part Aug 13, 2019 at 18:38

1 Answer 1

0

<aura:attribute name="dependentOptions" type="List"/> this attribute is of type List. In your aura:if definition, You have compared it with String Value. This will never be satisfied to true.

<aura:if isTrue="{!v.dependentOptions == 'Report'}" >
    <a href="https://map.baidu.com"> Visit baidu!</a>
</aura:if> 

Also, you cannot use anchor tag inside Lightning:select component. only <option value="{!d.value}">{!d.text}</option> will get rendered. Even if aura:if is true, content inside will not come as select list.

6
  • 1
    You must've meant isTrue="{!d.text == 'Report'}", right? Aug 13, 2019 at 18:40
  • yes that what i mean @SebastianKessel Aug 13, 2019 at 18:40
  • Exactly, @psalesforce1989 you need to make it isTrue="{!d.text == 'Report'}" Aug 13, 2019 at 18:41
  • i do exactly like this but nothing happens in my case i select Report but nothing happens . Aug 13, 2019 at 18:44
  • @SebastianKessel any luck on this Aug 13, 2019 at 18:46

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .