JavaScript onclick redirect

Question

I have this text field and button here

<input name="txtSearch" type="text" id="txtSearch" class="field" />            
<input type="submit" name="btnSearch" value="" id="btnSearch" class="btn" onclick="javascript:SubmitFrm()" />

and when the user clicks on the submit button this function is suppose to run

<script type="text/javascript">
    function SubmitFrm(){
        var Searchtxt = document.getElementById("txtSearch").value();
        window.location = "http://www.example.com/search/?Query=" + Searchtxt;
    }
</script>

But nothing happens, what I expecting to happen is when the user clicks on the submit button, take the value from the search text box and redirect the user to the url + the value of the search text box...

What am I doing wrong?

Answer 1

There are several issues in your code :

• You are handling the click event of a submit button, whose default behavior is to post a request to the server and reload the page. You have to inhibit this behavior by returning false from your handler:

  onclick="SubmitFrm(); return false;"
  

• value cannot be called because it is a property, not a method:

  var Searchtxt = document.getElementById("txtSearch").value;
  

• The search query you are sending in the query string has to be encoded:

  window.location = "http://www.mysite.com/search/?Query="
      + encodeURIComponent(Searchtxt);
  

Answer 2

Change the onclick from

onclick="javascript:SubmitFrm()"

to

onclick="SubmitFrm()"