Javascript URL redirect not working

Question

I have a search function here:

<form class="form-wrapper cf">
    <input type="text" placeholder="Enter keywords..">
    <button onclick="search_click();">Search</button>
</form>

search_click() is defined as follows:

function search_click(){
    window.location.replace("http://stackoverflow.com");
}

However, every time I click the button, it just reloads the current page and appends a '?' to the end of the URL if it wasn't already there. I've tried doing window.location.href also, but that doesn't work either. If I just replace that line with alert('test');, it does show a popup, so I know it's executing. What's wrong with my code? Or is this a problem with Django?

Answer 1

The form is actually submitting causing your Javascript to be ignored. Prevent the default event using the following script:

function search_click(event){
    event.preventDefault();
    window.location.replace("http://stackoverflow.com");
}

HTML

<form class="form-wrapper cf">
    <input type="text" placeholder="Enter keywords..">
    <button onclick="search_click(event);">Search</button>
</form>