How to pass variable to client/get rid of Id/share helper?

Question

1. How do I pass a variable to a client-side javascript controller (not the server side component) from a lightning component?

   <ui:button value="Press Me" press="{!c.clientFunction('abc')}" />
   

2. What is the best way to get the element id, not Aura id?

   <div class="slds-card" id="{!v.contact.Id}" aura:id="contactId">
   

   In given scenario, I have an element with aura:id as "contactId" and want to find its id. This is what I did to get it:

   var contactCard = component.find("contactId");
   var globalId = "[data-aura-rendered-by='"+contactCard.getGlobalId()+"']";
   var contactId = $("div"+globalId)[0].id;
   

3. Is it possible to share a helper utility across all components?

Answer 1

Here is your answer as per my understanding.

1. ({
     "echo" : function(cmp) {
      // create a one-time use instance of the serverEcho action
      // in the server-side controller
      var action = cmp.get("c.serverEcho");
      action.setParams({ firstName : cmp.get("v.firstName") });
   
       // Create a callback that is executed after 
       // the server-side action returns
       action.setCallback(this, function(response) {
           var state = response.getState();
           // This callback doesn’t reference cmp. If it did,
           // you should run an isValid() check
           //if (cmp.isValid() && state === "SUCCESS") {
           if (state === "SUCCESS") {
               // Alert the user with the value returned 
               // from the server
               alert("From server: " + response.getReturnValue());
   
               // You would typically fire a event here to trigger 
               // client-side notification that the server-side 
               // action is complete
           }
           //else if (cmp.isValid() && state === "ERROR") {
           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");
               }
           }
       });
   
       // optionally set abortable flag here
   
       // A client-side action could cause multiple events, 
       // which could trigger other events and 
       // other server-side action calls.
       // $A.enqueueAction adds the server-side action to the queue.
       $A.enqueueAction(action);
   }})
   

to pass value to javascript controller. You can't directly pass it

({
    getLabel : function(component, event, helper) {
        var myLabel = component.find("button1").get("v.label");
        component.set("v.buttonLabel", myLabel);
    }
})

Use this code sample for reference to pass parameters.

2. cmp.find("button1") find the component and then get the id.

   var cmp = $A.getComponent(globalId);

find the component using global id Reference

3. Yes. As per docs you can share a helper utility but i tried this before but it will not work for me.

Here is a good reference for your help.