Python Template overrides JavaScript Function [closed]

I have a button that submits a form to a flask server and runs a JS function. When the button is pressed the JS function runs , then it is overridden by the flask render_template function.

HTML:

<div id="index">
    <form action="/analyse" method="post">
        <!-- Form and button --!>
        <input id="fileupload" type="file" accept=".xlsx, .xls" name="fileupload" />
        <input type="submit" class="button" value="Send to Server" onclick="hide()"/>
    </form>
</div>

<div id="analyse" class="hidden">
    <!-- The hidden items that will be visible after the submittion of the form --!>
</div>

JS Button Function:

// Function hides the form and unhides the 'analyse' div
// Another function reverses hide() function
function hide() {
    var index = document.getElementById('index');
    var analyse = document.getElementById('analyse');
    index.classList.add('hidden');
    analyse.classList.remove('hidden');
}

Server-side Python:

@app.route('/', methods=['GET','POST'])
def index():
    return render_template('index.html')

@app.route('/analyse', methods=['GET','POST'])
def analyse():
    # Validation and functions, etc.
    return render_template('index.html')