Javascript Button redirecting to http://127.0.0.1:5000/?

Question

I am new to web technologies, trying to build a basic website. Technology stack: Python+Flask and HTML+CSS+JS on frontend.

I have a button, from which I am trying to redirect to a relative URL: Button html:

<div class="form-group">
    <input type="submit" 
           class="btn btn-primary btn-lg btn-block pb_btn-pill  btn-shadow-blue"
           value="Register"
           onclick="approve()">
</div>

Javascript:

function approve() {
    window.location.href = '/approve';
}

This is not taking me to: http://127.0.0.1:5000/approve rather to: http://127.0.0.1:5000/?

Can anyone please guide?

SOLUTION: Thank you all, this helped: return false https://stackoverflow.com/a/26518061/4253760

I still have a question, what is this URL with ? mark http://127.0.0.1:5000/?

Answer 1

Your button is of type "submit". This will submit the form. The form has no URL defined, so it assumes the current document, in your case "/". The question mark in "/?" is followed by the form contents (key/values), in your case, the form is empty (it has no input values, only a button)

You should use input of type "button" or the onclick should read "approve(); return false" to prevent the form from being submitted and instead execute your function

Answer 2

Change your input type to use button

<div class="form-group">
    <input type="button" 
           class="btn btn-primary btn-lg btn-block pb_btn-pill  btn-shadow-blue"
           value="Register"
           onclick="approve()">
</div>

Because you were using submit it would have submitted to the form action rather than your javascript.