Get the Value in an Input Text Box

Get the value in an input text box

//Get
var bla = $('#txt_name').val();

//Set
$('#txt_name').val(bla);

How do I get the value of text input field using JavaScript?

There are various methods to get an input textbox value directly (without wrapping the input element inside a form element):

Method 1

document.getElementById('textbox_id').value to get the value of
desired box

For example

document.getElementById("searchTxt").value;

Note: Method 2,3,4 and 6 returns a collection of elements, so use [whole_number] to get the desired occurrence. For the first element, use [0],
for the second one use [1], and so on...

Method 2

Use
document.getElementsByClassName('class_name')[whole_number].value which returns a Live HTMLCollection

For example

document.getElementsByClassName("searchField")[0].value; if this is the first textbox in your page.

Method 3

Use document.getElementsByTagName('tag_name')[whole_number].value which also returns a live HTMLCollection

For example

document.getElementsByTagName("input")[0].value;, if this is the first textbox in your page.

Method 4

document.getElementsByName('name')[whole_number].value which also >returns a live NodeList

For example

document.getElementsByName("searchTxt")[0].value; if this is the first textbox with name 'searchtext' in your page.

Method 5

Use the powerful document.querySelector('selector').value which uses a CSS selector to select the element

For example

document.querySelector('#searchTxt').value; selected by id
document.querySelector('.searchField').value; selected by class
document.querySelector('input').value; selected by tagname
document.querySelector('[name="searchTxt"]').value; selected by name

Method 6

document.querySelectorAll('selector')[whole_number].value which also uses a CSS selector to select elements, but it returns all elements with that selector as a static Nodelist.

For example

document.querySelectorAll('#searchTxt')[0].value; selected by id
document.querySelectorAll('.searchField')[0].value; selected by class
document.querySelectorAll('input')[0].value; selected by tagname
document.querySelectorAll('[name="searchTxt"]')[0].value; selected by name

Support

Browser	Method1	Method2	Method3	Method4	Method5/6
IE6	Y(Buggy)	N	Y	Y(Buggy)	N
IE7	Y(Buggy)	N	Y	Y(Buggy)	N
IE8	Y	N	Y	Y(Buggy)	Y
IE9	Y	Y	Y	Y(Buggy)	Y
IE10	Y	Y	Y	Y	Y
FF3.0	Y	Y	Y	Y	N IE=Internet Explorer
FF3.5/FF3.6	Y	Y	Y	Y	Y FF=Mozilla Firefox
FF4b1	Y	Y	Y	Y	Y GC=Google Chrome
GC4/GC5	Y	Y	Y	Y	Y Y=YES,N=NO
Safari4/Safari5	Y	Y	Y	Y	Y
Opera10.10/
Opera10.53/	Y	Y	Y	Y(Buggy)	Y
Opera10.60
Opera 12	Y	Y	Y	Y	Y

How to get text box value in 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>

Get the value of input text element after pressing submit button in django

request.GET key is the name of the input. So, in your case, since you want the value of <input type="text" name="results"> you should get that value from request.GET.get('results').

However, there is also a {{ search_results }} value that it's not get rendered from your index view. Thus, it will always be null.

def results(request):
    inp_value = request.GET.get('results', 'This is a default value')
    context = {'inp_value': inp_value}
    return render( request, 'results.html', context)

Cant get input text value with jquery

you can use .val() to get value of input.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html><head></head><body>  <div id="content">  <input type="text" id="textfield">  <button type="button" id="btn" onclick="go()">Go</button></div><script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script><script type="text/javascript">function go(){    console.log($("#textfield").val());}</script></body></html>

Getting value of HTML text input

See my jsFiddle here: http://jsfiddle.net/fuDBL/

Whenever you change the email field, the link is updated automatically. This requires a small amount of jQuery. So now your form will work as needed, but your link will be updated dynamically so that when someone clicks on it, it contains what they entered in the email field. You should validate the input on the receiving page.

$('input[name="email"]').change(function(){
  $('#regLink').attr('href')+$('input[name="email"]').val();
});

How to get value of input text field without knowing its id in Javascript

Is this the kind of thing that you're looking to implement? Of course most of it is pseudo code, but it's pretty straight-forward, just get all relevant inputs and buttons and whatnot, attach some event handler to them and update the application state.

I've included some basic functions that you may wish to fire in certain scenarios, such as onStateUpdate, there may be no need for this function, but it probably wouldn't hurt to keep it for the sake of simplcity.

I've used mostly ES6 oriented syntax because it allows you to achieve the same results with less code, I'm just that lazy.

The reason why I used a self invoked function just so there's no issues with variable names and nothing can be manipulated on the global scope, etc. If you'd like to read or know more about why self invoked functions can be pretty good, then I suggest you read sources such as this.

// Self invoked anonymous function. (function() {  // The application state.  const state = {};
  // Lazy way to use querySelectorAll  const $e = qs => document.querySelectorAll(qs);
  // Make a copy of the state and make it global.  const getState = () => {    window.state = { ...state};    console.clear();    console.log(window.state);  };
  // A function to run when the state updates.  const onStateUpdate = () => {    // Do some other stuff...     getState();  };
  // Handle the key up event.  const inputHandler = (i, index) => i.onkeyup = () => {    i.id == null || i.id == '' ? i.setAttribute("id", index) : null;    const id = i.id;    state[id] = i.value;    onStateUpdate();  };
  // Handle a button being clicked.  const clickHandler = btn => btn.onclick = onStateUpdate;
  // Handle the enter key being pressed.  const enterHandler = e => e.keyCode == 13 ? onStateUpdate() : null;
  // Assign all relevant events to the relevant functions.   const dispatchEvents = () => {    const inputs = $e("#search-container input[type=text]");    const buttons = $e("#search-container button");
    inputs.forEach((i, index) => inputHandler(i, index));    buttons.forEach(b => clickHandler(b));    window.onkeypress = enterHandler;  };
  // Fire the dispatch function.   dispatchEvents();}());

<!-- this one does nothing as it's outside of the search-container element --><input type="text" id="testing" placeholder="I do nothing!" />
<div id="search-container">  <input type="text" id="test" />  <input type="text" id="demo" />  <input type="text" id="markup" />  <input type="text" />  <button>Search</button></div>

How to get value of textbox in jquery using name?

For selecting all elements with name="quantity"

# HTML
<input type="text" name="quantity" value="1" class="input-text ">

#jquery
$('[name="quantity"]').val() // 1

For selecting all elements with name=*

# HTML
<input type="text" name="quantity" value="1" class="input-text ">
<input type="text" name="quality" value="2" class="input-text ">

#jquery
$('[name]').first().val() // 1
$('[name]').last().val() // 2

Get the Value in an Input Text Box