javascript how to return a value from event function to outer function

Question

Can someone please help me with this. I what to return var from input event function to outer function.

function takeInputText() {

    var input = document.getElementById('inputText')
    var newText;

    input.onkeyup = function(e) {

        var text = input.value;
        if ( e.which == 13 ) {
            newText = text;
            input.value = '';
            //return newText  - I want to return 'newText' to 'takeInputText()' so i can 
                               // use 'takeInputText()' as a variable
        }
    }   
}
takeInputText();

What's your problem ? newText variable can be accessible from the takeInputText() method also. — Kalpesh Rajai
– Kalpesh Rajai, Commented Jun 30, 2016 at 16:36
This isn't a duplicate, but a good hint is How do I return the response from an asynchronous call? — castletheperson
– castletheperson, Commented Jun 30, 2016 at 16:38
What you want to do with that input ? I assume you are going by wrong direction... — Rayon
– Rayon, Commented Jun 30, 2016 at 16:40
"I want to return 'newText' to 'takeInputText()' so i can // use 'takeInputText()' as a variable" What would takeInputText be passed to? — guest271314
– guest271314, Commented Jun 30, 2016 at 16:51
To help you understand the answers, what you want to do is not possible in the form you're asking about. The onkeyup function is asynchronous. It isn't called at the same time as your other code, it is called later when the user hits and releases a key. So you can't "return" a value, because there is nothing to return it to. Instead, as shown in the various answers, to use newText somewhere else in your code, you have to call a function and pass it as an argument to that function. — Michael Geary
– Michael Geary, Commented Jun 30, 2016 at 17:56

Rayon · Accepted Answer · 2016-06-30 17:17:03Z

3

If you are willing to play with the value of the input once user hit enter key, bind keyup event over input and manipulate the value in the callback function. You can also call another function in which value of the input could be passed.

Example:

var input = document.getElementById('inputText');
input.onkeyup = function(e) {
  var code = e.which || e.keyCode;
  if (code == 13) {
    appendInput(this.value);
    this.value = '';
  }
}

function appendInput(value) {
  var elem = document.createElement('h2');
  elem.textContent = value;
  document.getElementById('preview').appendChild(elem);
}

<input type="text" id="inputText">
<div id="preview"></div>

answered Jun 30, 2016 at 17:17

Rayon

36.6k5 gold badges54 silver badges78 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Mars Cheng · Accepted Answer · 2016-06-30 16:41:25Z

1

You cannot use takeInputText() as a variable since what you are doing inside takeInputText is just attaching a keyup listener to the input element and the function returns immediately (undefined is returned in this case).

To make use of the value, pass the variable as an argument to a function that you want to invoke when the condition inside the handler is true, for example:

input.onkeyup = function(e) {
    var text = input.value;
    if ( e.which == 13 ) {
        input.value = '';
        yourFunction(text);
    }
}

answered Jun 30, 2016 at 16:41

Mars Cheng

313 bronze badges

Collectives™ on Stack Overflow

javascript how to return a value from event function to outer function

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related