8

Below is my code to create the component dynamically - The component is "ui:inputselect"

$A.createComponent(
            RecoveryLineItem.Attributes[i].name,{
                "class" : "slds-input ",
                "aura:id" : 'ExampleId',
                "label" : RecoveryLineItem.Attributes[i].label,
                "multiple" : RecoveryLineItem.Attributes[i].multiple
            }, ....

..

console.log(component.find('ExampleId').get("v.value")) 

Or console.log(component.find('ExampleId')) is Giving as 'Undefined"

How to access the aura:id of the dynamically created components?

  • can you please provide more code, i think you are missing ui:inputselect in your code. – Raj_SFDC Oct 5 '16 at 7:10
  • Have you figure out the solutions? I tried Junaid's but it doesn't work for me. Cheers – user682217 Nov 12 '16 at 22:35
9

Sorry can't comment yet.

But i have the same problem when using cmp.find() to get a dynamically created component the return value is always undefined.

I even tried it with the code provided in the documentation(https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/js_cb_dynamic_cmp_async.htm).

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

    <p aura:id="test">Dynamically created button</p>
    {!v.body}
</aura:component>


/*createComponentController.js*/
({
    doInit : function(cmp) {
        $A.createComponent(
            "ui:button",
            {
                "aura:id": "findableAuraId",
                "label": "Press Me",
                "press": cmp.getReference("c.handlePress")
            },
            function(newButton, status, errorMessage){
                //Add the new button to the body array
                if (status === "SUCCESS") {
                    var body = cmp.get("v.body");
                    body.push(newButton);
                    cmp.set("v.body", body);
                }
                else if (status === "INCOMPLETE") {
                    console.log("No response from server or client is offline.")
                    // Show offline error
                }
                else if (status === "ERROR") {
                    console.log("Error: " + errorMessage);
                    // Show error message
                }
            }
        );
    },

    handlePress : function(cmp) {
        console.log("button pressed");
        console.log(cmp.find("findableAuraId"));
    }
})

The first console log works, the second one returns 'undefined'

A possible workaround : cmp.find({ instancesOf : "auradocs:sampleComponent" }) which returns an array of all "auradocs:sampleComponent"

handlePress : function(cmp) {
    var button = cmp.find({ instancesOf : "ui:button" })[0];
    button.set("v.label", "test");
}
  • 2
    I just tried that myself and can confirm cmp.find(”findableAuraId”) returns undefined on dynamically created cmp. cmp.find('myId') works without problems on a generically created component. – Christian Szandor Knapp Nov 23 '16 at 15:40
  • Just tried this, and the second log returned the component. – Kris Gray Dec 11 '17 at 5:27
7

I believe this issue is related to Dynamically created component with aura:id, set as a Facet inside a parent component, is not found when calling find() and passing in aura:id

Have a look at the answer from Trevor Bliss

  • 1
    Currently the answer provided in the above post is the easiest workaround - component.get("v.*attributeName*").get("v.value"); – Brian Mansfield Mar 16 '17 at 15:34
3

YOu have to specify the type of component as "ui:inputselect"

$A.createComponent(
        "ui:inputselect",
        {
            "class" : "slds-input ",
            "aura:id" : 'ExampleId',
            "label" : RecoveryLineItem.Attributes[i].label,
            "multiple" : RecoveryLineItem.Attributes[i].multiple
        },
        function(status, errorMessage){
            //Add the new button to the body array
            if (status === "SUCCESS") {
                //some code.
            }
            else if (status === "INCOMPLETE") {
               //some code.
            }
            else if (status === "ERROR") {
                //some code.
            }
        }
 );
3

This Bug has been resolved with Spring 18 release: Release Notes

-1

Posting it again as the issue still persists..

To get the value from a dynamically created component, use :

var value = component.get("v.*attributeName*").get("v.value");// for type="Aura.Component"

OR

var value = component.get("v.*attributeName*")[0].get("v.value"); // for type="Aura.Component[]"

For more information, please do checkout this link

The above answer is based on one of techbisinessman's answers.All credits go to him.

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.