• Megha Jaju
  • NEWBIE
  • 30 Points
  • Member since 2015

  • Chatter
    Feed
  • 1
    Best Answers
  • 0
    Likes Received
  • 0
    Likes Given
  • 0
    Questions
  • 1
    Replies
I have implemented an application in which I have two different buttons.

Button One
<c:FGButton class="slds-button slds-button--small slds-button--neutral" label="Download CSV" svgXlinkHref="/resource/SLDS102/assets/icons/action-sprite/svg/symbols.svg#download" svgClass="slds-icon slds-icon--x-small slds-icon-text-default slds-m-right--small" onclick="{!c.downloadCSV}"/>
Button Two
<c:FGButton class="slds-button slds-button--small slds-button--neutral" label="Download CSV" svgXlinkHref="/resource/SLDS102/assets/icons/action-sprite/svg/symbols.svg#download" svgClass="slds-icon slds-icon--x-small slds-icon-text-default slds-m-right--small" onclick="{!c.downloadAccountCSV}"/>

I am calling two different functions on the click of these buttons. Below is my app controller which contains these functions
({
	showModalBox: function(component, event, helper) {

        var modalBoxFind = component.find("oppModalBox");
        var modalBoxLocalId = modalBoxFind.getLocalId();

        modalBoxFind.set("v.modalSectionClass","slds-modal slds-fade-in-open");
        modalBoxFind.set("v.backgroundClass","slds-backdrop slds-backdrop--open");

        /*var createOpportunityEvent = $A.get("e.force:createRecord");
        createOpportunityEvent.setParams({
            "entityApiName" : "Opportunity"
        });
        createOpportunityEvent.fire();*/

	},

    downloadCSV: function(component, event, helper)
    {

        helper.getCSVDataFromServer(component);
    },

    showAccountsPane: function(component)
    {
        var opptyPane = component.find('opportunityPanel');
        var accountsPane = component.find('accountPanel');

        $A.util.addClass(opptyPane,'slds-hide');
        $A.util.removeClass(accountsPane,'slds-hide');
    },

    showOpportunityPane: function(component)
    {
        console.log('Inside Oppty Pane JS');
        var opptyPane = component.find('opportunityPanel');
        var accountsPane = component.find('accountPanel');


        $A.util.removeClass(opptyPane,'slds-hide');
        $A.util.addClass(accountsPane,'slds-hide');

    },

    downloadAccountCSV: function(component)
    {
        console.log('Inside Account CSV JS controller');
        console.log('helper' +  helper);

        helper.getAccountCSVDataFromServer(component);
    }


})

As you can see I am calling two different helper methods from these two functions. Below are the helper methods in the helper controller of the app.
({
	getCSVDataFromServer: function(component) {

        console.log('Inside helper function')

        var action = component.get("c.getOpportunityCSV");
        var csvContent = "data:text/csv;charset=utf-8,";

        var link = document.createElement("a");

        //var csvContent = "data:text/csv";

        action.setCallback(this,function(actionResult)

        {
            csvContent = csvContent + actionResult.getReturnValue();
            var encodedUri = encodeURI(csvContent);
            //console.log('CSV String' + actionResult.getReturnValue());
            //window.open(encodedUri);

            link.setAttribute("href", encodedUri);
            link.setAttribute("download", "Opportunities.csv");
            link.click();
        });

        $A.enqueueAction(action);
	},

    getAccountCSVDataFromServer: function(component)
    {
        /*var action = component.get("c.getAccountCSV");
        var csvContent = "data:text/csv;charset=utf-8,";

        var link = document.createElement("a");

        //var csvContent = "data:text/csv";

        action.setCallback(this,function(actionResult)

        {
            csvContent = csvContent + actionResult.getReturnValue();
            var encodedUri = encodeURI(csvContent);
            //console.log('CSV String' + actionResult.getReturnValue());
            //window.open(encodedUri);

            link.setAttribute("href", encodedUri);
            link.setAttribute("download", "Accounts.csv");
            link.click();
        });

        $A.enqueueAction(action);*/
        console.log('inside account csv helper function');

    }
})

Button when I click the 2nd button which calls the downloadAccountCSV function

I am getting error saying that 
Helper is not defined.
 
I have implemented an application in which I have two different buttons.

Button One
<c:FGButton class="slds-button slds-button--small slds-button--neutral" label="Download CSV" svgXlinkHref="/resource/SLDS102/assets/icons/action-sprite/svg/symbols.svg#download" svgClass="slds-icon slds-icon--x-small slds-icon-text-default slds-m-right--small" onclick="{!c.downloadCSV}"/>
Button Two
<c:FGButton class="slds-button slds-button--small slds-button--neutral" label="Download CSV" svgXlinkHref="/resource/SLDS102/assets/icons/action-sprite/svg/symbols.svg#download" svgClass="slds-icon slds-icon--x-small slds-icon-text-default slds-m-right--small" onclick="{!c.downloadAccountCSV}"/>

I am calling two different functions on the click of these buttons. Below is my app controller which contains these functions
({
	showModalBox: function(component, event, helper) {

        var modalBoxFind = component.find("oppModalBox");
        var modalBoxLocalId = modalBoxFind.getLocalId();

        modalBoxFind.set("v.modalSectionClass","slds-modal slds-fade-in-open");
        modalBoxFind.set("v.backgroundClass","slds-backdrop slds-backdrop--open");

        /*var createOpportunityEvent = $A.get("e.force:createRecord");
        createOpportunityEvent.setParams({
            "entityApiName" : "Opportunity"
        });
        createOpportunityEvent.fire();*/

	},

    downloadCSV: function(component, event, helper)
    {

        helper.getCSVDataFromServer(component);
    },

    showAccountsPane: function(component)
    {
        var opptyPane = component.find('opportunityPanel');
        var accountsPane = component.find('accountPanel');

        $A.util.addClass(opptyPane,'slds-hide');
        $A.util.removeClass(accountsPane,'slds-hide');
    },

    showOpportunityPane: function(component)
    {
        console.log('Inside Oppty Pane JS');
        var opptyPane = component.find('opportunityPanel');
        var accountsPane = component.find('accountPanel');


        $A.util.removeClass(opptyPane,'slds-hide');
        $A.util.addClass(accountsPane,'slds-hide');

    },

    downloadAccountCSV: function(component)
    {
        console.log('Inside Account CSV JS controller');
        console.log('helper' +  helper);

        helper.getAccountCSVDataFromServer(component);
    }


})

As you can see I am calling two different helper methods from these two functions. Below are the helper methods in the helper controller of the app.
({
	getCSVDataFromServer: function(component) {

        console.log('Inside helper function')

        var action = component.get("c.getOpportunityCSV");
        var csvContent = "data:text/csv;charset=utf-8,";

        var link = document.createElement("a");

        //var csvContent = "data:text/csv";

        action.setCallback(this,function(actionResult)

        {
            csvContent = csvContent + actionResult.getReturnValue();
            var encodedUri = encodeURI(csvContent);
            //console.log('CSV String' + actionResult.getReturnValue());
            //window.open(encodedUri);

            link.setAttribute("href", encodedUri);
            link.setAttribute("download", "Opportunities.csv");
            link.click();
        });

        $A.enqueueAction(action);
	},

    getAccountCSVDataFromServer: function(component)
    {
        /*var action = component.get("c.getAccountCSV");
        var csvContent = "data:text/csv;charset=utf-8,";

        var link = document.createElement("a");

        //var csvContent = "data:text/csv";

        action.setCallback(this,function(actionResult)

        {
            csvContent = csvContent + actionResult.getReturnValue();
            var encodedUri = encodeURI(csvContent);
            //console.log('CSV String' + actionResult.getReturnValue());
            //window.open(encodedUri);

            link.setAttribute("href", encodedUri);
            link.setAttribute("download", "Accounts.csv");
            link.click();
        });

        $A.enqueueAction(action);*/
        console.log('inside account csv helper function');

    }
})

Button when I click the 2nd button which calls the downloadAccountCSV function

I am getting error saying that 
Helper is not defined.