Getting empty string or null value from textbox

Question

I am trying to test a simple <input> item and then print the contents to the console. I have a textbox and will insert some text with then hoping to see the data printed to the console but this is not happening. I am actually trying to test a more complicated item with the <input> being JSON and then reading the fields without knowing what kind of JSON it is or the number of JSON fields.

var input = document.getElementById('my-text-box').value;
var jsonString = JSON.stringify(input);

console.log(document.getElementById('my-text-box').value);

try {
  /*
  message_content = JSON.parse(input);
  
  var message = JSON.parse(input);
  
  for (var key in message) {
    var keyjson = message[key];
    
    if (typeof infoJSON !== "object") {
      console.log(keyjson)
    }
  }
  */
} catch (e) {
  error = true;
  log.error('Something went wrong', e)
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<input id="my-text-box"></input>

Here’s a JSFiddle

Thanks I tried that and still not working; its weird, I used other jsfiddle examples others posted & it does not work for. Almost as if browser settings on my side causing some issue. — vbNewbie
– vbNewbie, Commented Jul 26, 2018 at 19:49

Faical ARAB · Accepted Answer · 2018-07-26 20:01:54Z

2

First of all Element.value() is not a function, so instead use Element.value this is only valid for input elements.

Second, var input is always assigned an empty string because it was executed before any character enters the input element, to avoid that use the following :

input.addEventListener( 'change', function(){ 
       inputVal = JSON.stringify( this.value ); 
       console.log( inputVal ); 
    })

answered Jul 26, 2018 at 20:01

Faical ARAB

3853 silver badges14 bronze badges

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

Comments

Willem van der Veen · Accepted Answer · 2018-07-26 19:40:29Z

2

Your first line:

 var input = document.getElementById('my-text-box').value();

Should be

 var input = document.getElementById('my-text-box').value;

Since value is a property which is not a function, it is a string.

answered Jul 26, 2018 at 19:40

Willem van der Veen

37k19 gold badges208 silver badges177 bronze badges

1 Comment

vbNewbie Over a year ago

I did have this but still not working but still returning empty string. Thanks for your response.

Fobos · Accepted Answer · 2018-07-26 19:49:13Z

0

Try this

var textArea = document.getElementById("text");

textArea.addEventListener("change", function() {
    console.log(this.value);
});

<textarea id="text"></textarea>

answered Jul 26, 2018 at 19:49

Fobos

1,1768 silver badges18 bronze badges

1 Comment

vbNewbie Over a year ago

this works running it here; is there an issue if I am running with jquery (Edge) in order to have console.log work.

user2211823 · Accepted Answer · 2018-07-26 19:50:45Z

0

To take the value of an input, do it this way

console.log(document.getElementById('my-text-box').value);

answered Jul 26, 2018 at 19:50

user2211823

Collectives™ on Stack Overflow

Getting empty string or null value from textbox

4 Answers 4

Comments

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related