Error getElement is not a function in lightning component / event.getParams is not a function

Question

I have a lightning component that contains an input like this :

<ui:inputText aura:id="searchTerm" class="form-control" placeholder="..." keyup="{!c.rechercher}" />

I want that the logic of my JS method is started when the user press the "enter" button, so I did that :

rechercher : function(component, event, helper){
    var j$ = jQuery.noConflict();
    var searchTerm = component.find('searchTerm');
    var jSearchTerm = j$(searchTerm.getElement());

    component.set('v.searchTerm', jSearchTerm.val());

    if(event.getParams().keyCode == 13 ){
        var action = component.get("c.getSearchKnowledgeArticles");
        action.setParams({
            'searchTerm' : jSearchTerm.val()
        });
        action.setCallback(this, function(a) {
            var state = a.getState();
            console.log('### state : ' + state);
            if (state === "SUCCESS"){
                var result = a.getReturnValue();
                component.set('v.searchResults', result);
                var nbResult = result.length;
                console.log('nbResult : ' + nbResult);
                component.set('v.nbResult', nbResult);
            }
        });
        $A.enqueueAction(action);
    }
}

But when I ty this I got the error : "searchTerm.getElement is not a function"

But if I try to change the tag in the component like that :

<input type="text" id="search" aura:id="searchTerm" class="form-control" placeholder="..." onkeyup="{!c.rechercher}" />

Then I got the error : "event.getParams is not a function"

Answer 1

You can access search term value something like this:

  var searchTerm=component.find("searchTerm").get("v.value");

you will get searchTerm here, then you can pass that value to server side controller.

better to use ui:inputText

     if(event.getParams().keyCode == 13 ){      //in case of enter key pressesd
    var action = component.get("c.getSearchKnowledgeArticles");
    action.setParams({
        "searchTerm" : searchTerm
    });

I dont think you need these 2 lines of code

 var jSearchTerm = j$(searchTerm.getElement()); //You are getting error.You are declared some thing like function

component.set('v.searchTerm', jSearchTerm.val())