Uncaught ReferenceError: getStr is not defined

Question

I am trying to test addEventListener with a function as an argument to a closure function. if I call without addEventListener it gives me the value and using addEventListener give the error that getStr is not a function. Any help please!

---

Name: <input type="text" id = "myText" value="" placeholder="String ..." />
<button type="submit">Submit Search</button>
<div id="od"></div>

var getStrVal = (function(strFunc) {
    console.log(strFunc);
    document.getElementById("od").innerHTML = strFunc;
})();

//get string value              
var strSol = function() {
    var searchStr = document.getElementById("myText").value;
}

addEventListener("click", getStrVal(strSol), false);

Answer 1

This is a working sample of what you are trying to achieve. I have removed your immediately invoked getStrVal function which gave you Uncaught TypeError: getStrVal is not a function

 var getStrVal = function(strFunc) { document.getElementById("od").innerHTML = strFunc(); }; //get string value var strSol = function() { return document.getElementById("myText").value; } document.getElementById('btn').onclick = function() { getStrVal(strSol); }; 

 Name: <input type="text" id = "myText" value="" placeholder="String ..." /> <button id="btn" type="submit">Submit Search</button> <div id="od"></div>