How to get text box value in JavaScript

Viewed 820408

I am trying to use JavaScript to get the value from an HTML text box but value is not coming after white space

For example:

<input type="text" name="txtJob" value="software engineer">

I only get: "software" from the above. I am using a script like this:

var jobValue = document.getElementById('txtJob').value

How do I get the full value: "software engineer"?

16 Answers

Your element does not have an ID but just a name. So you could either use getElementsByName() method to get a list of all elements with this name:

var jobValue = document.getElementsByName('txtJob')[0].value  // first element in DOM  (index 0) with name="txtJob"

Or you assign an ID to the element:

<input type="text" name="txtJob" id="txtJob" value="software engineer">

+1 Gumbo: ‘id’ is the easiest way to access page elements. IE (pre version 8) will return things with a matching ‘name’ if it can't find anything with the given ID, but this is a bug.

i am getting only "software".

id-vs-name won't affect this; I suspect what's happened is that (contrary to the example code) you've forgotten to quote your ‘value’ attribute:

<input type="text" name="txtJob" value=software engineer>

Set the id attribute of the input to txtJob. Your browser is acting quirky when you call getElementById.

Provided when you want the text box value. Simple one:

<input type="text" value="software engineer" id="textbox">

var result = document.getElementById("textbox").value;

If it is in a form then it would be:

<form name="jojo">
<input name="jobtitle">
</form>

Then you would say in javascript:

var val= document.jojo.jobtitle.value

document.formname.elementname

Here is a simple way

document.getElemmentByName("txtJob").getAttribute("value")
 var jobValue=document.FormName.txtJob.value;

Try that code above.

jobValue : variable name.
FormName : Name of the form in html.
txtJob : Textbox name

This should be simple using jquery:

HTML:

  <input type="text" name="txtJob" value="software engineer">

JS:

  var jobValue = $('#txtJob').val(); //Get the text field value
  $('#txtJob').val(jobValue);        //Set the text field value
Related