How to get text box value in JavaScript
JavascriptHtmlJavascript Problem Overview
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"?
Javascript Solutions
Solution 1 - Javascript
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">
Solution 2 - Javascript
+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>
Solution 3 - Javascript
var word = document.getElementById("word").value;//by id
or
var word = document.forms[0].elements[0].value;//by index
//word = a word from form input
var kodlandi = escape(word);//apply url encoding
alert(escape(word));
or
alert(kodlandi);
the problem you are not using encoding for input values from form so not browser adds ones to ...
ontop has some problems as unicode encoding/decoding operations so use this function encoding strings/arrays
function urlencode( str )
{
// http://kevin.vanzonneveld.net3.
// + original by: Philip Peterson4.
// + improved by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)5.
// * example 1: urlencode('Kevin van Zonneveld!');
// * returns 1: 'Kevin+van+Zonneveld%21'7.
var ret = str;
ret = ret.toString();
ret = encodeURIComponent(ret);
ret = ret.replace(/%20/g, '+');
return ret;
}
ex.
var word = "some word";
word = urlencode(word);
Solution 4 - Javascript
<!DOCTYPE html>
<html>
<body>
<label>Enter your Name here: </label><br>
<input type= text id="namehere" onchange="displayname()"><br>
<script>
function displayname() {
document.getElementById("demo").innerHTML =
document.getElementById("namehere").value;
}
</script>
<p id="demo"></p>
</body>
</html>
Solution 5 - Javascript
Set the id attribute of the input to txtJob. Your browser is acting quirky when you call getElementById.
Solution 6 - Javascript
Provided when you want the text box value. Simple one:
<input type="text" value="software engineer" id="textbox">
var result = document.getElementById("textbox").value;
Solution 7 - Javascript
If you are using ASP.NET, the server-side code tags in these examples below will provide the exact control ID, even if you are using Master pages.
Javascript:
document.getElementById("<%=MyControlName.ClientID%>").value;
JQuery:
$("#<%= MyControlName.ClientID %>").val();
Solution 8 - Javascript
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
Solution 9 - Javascript
Here is a simple way
document.getElemmentByName("txtJob").getAttribute("value")
Solution 10 - Javascript
If you are using any user control and want to get any text box values then you can use the below code:
var result = document.getElementById('LE_OtherCostsDetails_txtHomeOwnerInsurance').value;
Here, LE_OtherCostsDetails, is the name of the user control and txtHomeOwnerInsurance is the id of the text box.
Solution 11 - Javascript
The problem is that you made a Tiny mistake!
This is the JS code I use:
var jobName = document.getElementById("txtJob").value;
You should not use name="". instead use id="".
Solution 12 - Javascript
You Need to change your code as below:-
<html>
<body>
<div>
<form align="center" method=post>
<input id="mainText" type="text" align="center"placeholder="Search">
<input type="submit" onclick="myFunction()" style="position: absolute; left: 450px"/>
</form>
</div>
<script>
function myFunction(){
$a= document.getElementById("mainText").value;
alert($a);
}
</script>
</body>
</html>
Solution 13 - Javascript
because you used space between software engineer html/php will not support space between value under textbox, you have to use this code
<input type="text" name="txtJob" value=software_engineer>
It will work
Solution 14 - Javascript
var jobValue=document.FormName.txtJob.value;
Try that code above.
jobValue : variable name.
FormName : Name of the form in html.
txtJob : Textbox name
Solution 15 - Javascript
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
Solution 16 - Javascript
Set id for the textbox. ie,
<input type="text" name="txtJob" value="software engineer" id="txtJob">
In javascript
var jobValue = document.getElementById('txtJob').value
In Jquery
var jobValue = $("#txtJob").val();