TextBox and Button JS Onclick

Question

I have a textbox. I wanted to use a JS onclick to append the input in the textbox to the "btnGO" button as below but it's not working:

document.getElementById('btnGo').onclick = function() {
  var search = document.getElementById('dlrNum').value;
  window.location.url = "http://consumerlending/app/indirect/dealerComments.aspx?dlrNum=" + search;
}

<input id="dlrNum" type="text" name="dlrNum" autocompletetype="disabled" class="ui-autocomplete-input" autocomplete="off">
<input id="btnGo" type="submit" value="GO" name="GO" runat="server">

What could I be missing?

a) You should wrap this code to the onload listener; b) window.location.assign(URL) — Ruben Kazumov
– Ruben Kazumov, Commented Jan 4, 2017 at 21:38
Where are you putting this javascript? If it is in the head, you'll need to wrap it so that it waits for the elements to load before trying to bind events to them. Otherwise, it can go at the end of the <body> section. — Tyler Roper
– Tyler Roper, Commented Jan 4, 2017 at 21:39

Dekel · Accepted Answer · 2017-01-04 21:42:48Z

4

You had several problems there: 1. Your <input> elements are probably part of a form, so when you click on the submit button - the form will submit, unless you prevent it. 2. You need to use window.location.href (and not .url).

Here is the fix to your code:

document.getElementById('btnGo').onclick = function(e) {
    e.preventDefault()
    var search = document.getElementById('dlrNum').value;
    window.location.href = "http://consumerlending/app/indirect/dealerComments.aspx?dlrNum=" + search;
}

Note the e element inside the function(e) - it's there so we can use the event object to prevent the default behavior of the form submission.

answered Jan 4, 2017 at 21:42

Dekel

62.9k12 gold badges109 silver badges130 bronze badges

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

Comments

johnniebenson · Accepted Answer · 2017-01-04 21:49:06Z

1

Update window.location.url to window.location:

window.location = "http://consumerlending/app/indirect/dealerComments.aspx?dlrNum=" + search;

answered Jan 4, 2017 at 21:49

johnniebenson

5403 silver badges9 bronze badges

Collectives™ on Stack Overflow

TextBox and Button JS Onclick

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related