+ Start a Discussion
Sherwin BetontaSherwin Betonta 

Transfer controller functions to helper.js

I coded my functions on the controller but I realized this is not a best practice to code directly on the controller. I tried transferring them but I get errors. Can somebody help me transfer my codes.

Note I exclude some functions. I already transfered already.
Accountcontroller.js
({
    "doInit": function(component, event, helper) {
        //initializes the component 
        helper.setPagination(component);
        //set data table headers
        component.set('v.columns', [
            { label: 'ACCOUNT NAME', fieldName: 'Name', type: 'text' },
            { label: 'NO. OF CONTACTS', fieldName: 'contacts', type: 'text' }
        ]);
    },
    "selectAccount":function(component,event,helper){
        var row = event.getParam('selectedRows');
        //fire event which shows the related contacts of the account selected
        var appEvent = $A.get("e.c:RelatedContactEvent");
        for(var r in row){
            var accId = row[r].Id;
            appEvent.setParams({
                "accId" : accId
            });
            appEvent.fire();
        }
    },
    "searchQueryChange": function(component, event) {
        var recordToDisply = component.get("v.pageSize");
        var searchKey = component.find("searchKey").get("v.value");
        //create a one-time use instance of the serverQuery action
        var action = component.get("c.searchQuery");
        if(searchKey != '' || searchKey != null){
            //prioritizes first page when searching
            component.set("v.page", 1);
            //dynamic searching
            component.set("v.pages", 1); 
        }
        //call server-side action
        action.setParams({
            "searchKey": searchKey,
            "recordToDisply": recordToDisply
        });
        action.setCallback(this, function(a) {
            let accounts = JSON.parse(a.getReturnValue());
            let accountsWithContacts = [];
            accounts.forEach(item =>{
                let newItem = {};
                             newItem.Name = item.Name;
                             newItem.Id = item.Id;   
                             if(item.Contacts)
            newItem.contacts = item.Contacts.totalSize + '';
            else
                newItem.contacts = '0';
            accountsWithContacts.push(newItem);
            if(searchKey == '' || searchKey == null){
                var page = component.get("v.pageCopy");
                var pages = component.get("v.pagesCopy");
                
                component.set("v.page", page);
                
                component.set("v.pages", pages);
            }
        })
        component.set("v.data", accountsWithContacts);
    });
    //adds the server-side controller action to the queue of actions to be executed
    $A.enqueueAction(action);
    },
    "handleSuccess" : function(component, event, helper) {
        var gotcha = $A.get("$Label.c.AccountCreateSuccess");
        component.set('v.isShowAccountForm', false);
        component.find('notifLib').showToast({
            "variant": "success",
            "title": gotcha
        });
        //refreshes the account table view after creating an account
        $A.get('e.force:refreshView').fire();
        
    },
    "navigate": function(component, event, helper) {
        // this function call on click on the previous page button
        var page = component.get("v.page") || 1;
        // get the previous button label
        var direction = event.getSource().get("v.label");
        // get the select option (drop-down) values.
        var recordToDisply = component.get("v.pageSize");
        // set the current page,(using ternary operator.)
        page = direction === "Previous" ? (page - 1) : (page + 1);
        // call the helper function
        helper.getAccounts(component, page, recordToDisply);
    }
})

ContactController.js.
"onSelectChange": function(component, event, helper) {
        // this function call on the select option change,   
        var page = 1
        var recordToDisply = component.find("recordSize").get("v.value");
        helper.getContacts(component, page, recordToDisply);
    },
   "handleSubmit": function(cmp, event, helper) {
        event.preventDefault();
        var accnt = cmp.get("v.accntId");
        var eventFields = event.getParam("fields");
        eventFields["AccountId"] = accnt;
        cmp.find('contactForm').submit(eventFields);
    },
    "handleSuccess" : function(component, event, helper) {
        var createsuccess = $A.get("$Label.c.ContactCreateSucess");
        component.set('v.isShowContactForm', false);
        component.find('notifLib').showToast({
            "variant": "success",
            "title": createsuccess
        });
        //refreshes the contact table view after creating a contact
        $A.get('e.force:refreshView').fire();
    },  
    "handleRowAction" : function (component, event, helper) {
        var action = event.getParam('action');
        var row = event.getParam('row');
        console.log("ACTION NAME: " + action.name);
       
        switch (action.name) {
            case 'view':
                var navEvt = $A.get("e.force:navigateToSObject");
                navEvt.setParams({
                      "recordId": row.Id,
                      "slideDevName": "details"
                    });
                navEvt.fire();
                break;
               
            case 'delete':
               var doAction = component.get("c.deleteContact");
              
               doAction.setParams({
                    "Id": row.Id
                });
                doAction.setCallback(this,function(response){
                    // store the response return value
                    var resultData = response.getReturnValue();
                    var state = response.getState();
                    var delsuccess = $A.get("$Label.c.ContactDeleteSuccess");
                    var delfail = $A.get("$Label.c.ContactDeleteFail");
                    if (state == "SUCCESS") {
                        if(resultData == true){
                            component.find('notifLib').showToast({                               
                                "variant": "success",
                                "title": delsuccess
                               });
                            $A.get('e.force:refreshView').fire();
                        }else{
                            component.find('notifLib').showToast({
                                "variant": "error",
                                "title": delfail
                               });   
                        }
                    }
                    
                });
                $A.enqueueAction(doAction);
                break;
        }
    },
    "navigate": function(component, event, helper) {
        // this function call on click on the previous page button  
        var page = component.get("v.page") || 1;
        // get the previous button label  
        var direction = event.getSource().get("v.label");
        // get the select option (drop-down) values.  
        var recordToDisply = component.get("v.pageSize");
        // set the current page,(using ternary operator.)  
        if(direction == "Previous"){
            page = (page - 1);
        }else{
            page = (page + 1);
        }
        component.set("v.page", page);
        // call the helper function
        helper.getContacts(component, event, page, recordToDisply);
    },

 
Best Answer chosen by Sherwin Betonta
shaik murthujavalishaik murthujavali
Hi,
As I see it is good work but just move "searchQueryChange", and "handleRowAction" functions to helper.
I think the reason why you are getting the error is:-You have mentioned function names in double qoutes(""), it doesn't require like that, so remove it.

Thanks.