Short

You can read value by searchTxt.value

<input name="searchTxt" type="text" maxlength="512" id="searchTxt" class="searchField"/>

<script type="text/javascript">
  function searchURL(){
    console.log(searchTxt.value);
    // window.location = "http://www.myurl.com/search/" + searchTxt.value;
  }
</script>





<!-- SHORT ugly test code -->
<button class="search" onclick="searchURL()">Search</button>

You can use onkeyup when you have more than one input field. Suppose you have four or input. Then document.getElementById('something').value is annoying. We need to write four lines to fetch the value of an input field.

So, you can create a function that store value in object on keyup or keydown event.

Example:

<div class="container">
    <div>
        <label for="">Name</label>
        <input type="text" name="fname" id="fname" onkeyup=handleInput(this)>
    </div>
    <div>
        <label for="">Age</label>
        <input type="number" name="age" id="age" onkeyup=handleInput(this)>
    </div>
    <div>
        <label for="">Email</label>
        <input type="text" name="email" id="email" onkeyup=handleInput(this)>
    </div>
    <div>
        <label for="">Mobile</label>
        <input type="number" name="mobile" id="number" onkeyup=handleInput(this)>
    </div>
    <div>
        <button onclick=submitData()>Submit</button>
    </div>
</div>

JavaScript:

<script>
    const data = { };

    function handleInput(e){
        data[e.name] = e.value;
    }

    function submitData(){
        console.log(data.fname); // Get the first name from the object
        console.log(data); // return object
    }
</script>

If your input is in a form and you want to get the value after submit you can do like:

<form onsubmit="submitLoginForm(event)">
    <input type="text" name="name">
    <input type="password" name="password">
    <input type="submit" value="Login">
</form>

<script type="text/javascript">

    function submitLoginForm(event){
        event.preventDefault();

        console.log(event.target['name'].value);
        console.log(event.target['password'].value);
    }
</script>

Benefit of this way: Example your page have 2 form for input sender and receiver information.

If you don't use form for get value then

• You can set two different id (or tag or name ...) for each field like sender-name and receiver-name, sender-address and receiver-address, ...
• If you set the same value for two inputs, then after getElementsByName (or getElementsByTagName ...) you need to remember 0 or 1 is sender or receiver. Later, if you change the order of 2 form in HTML, you need to check this code again

If you use form, then you can use name, address, ...

One can use the form.elements to get all elements in a form. If an element has id it can be found with .namedItem("id"). Example:

var myForm = document.getElementById("form1");
var text = myForm.elements.namedItem("searchTxt").value;
var url = "http://www.myurl.com/search/" + text;

Source: w3schools

Simple JavaScript:

function copytext(text) {
    var textField = document.createElement('textarea');
    textField.innerText = text;
    document.body.appendChild(textField);
    textField.select();
    document.execCommand('copy');
    textField.remove();
}

function searchURL() {
   window.location = 'http://www.myurl.com/search/' + searchTxt.value
}

So basically searchTxt.value will return the value of the input field with id='searchTxt'.

Short Answer

You can get the value of text input field using JavaScript with this code: input_text_value = console.log(document.getElementById("searchTxt").value)

More info

textObject has a property of value you can set and get this property.

To set you can assign a new value: document.getElementById("searchTxt").value = "new value"