I created an HTML page that has 4 sections.

In the most upper section, there is a form with an input field and a button.

Once the user writes his name and clicks the button, some ajax query is used in order to obtain data and populate a grid in the 2nd section.

My goal is to perform both of the things: to ajax query + scroll to section 2.

However, it does only one of them for some reason (either I remove the id="process_input" and then it scrolls but won't show any results or I remove it and then it shows results but not scrolling).

My code is (python):

@app.route("/")
def run():
    return render_template("main_layout.html")


@app.route('/_background_hiscore_process')
def _background_hiscore_process():
    try:
        username = request.args.get('username', 0, type = str)
        hiscore_data = read_hiscore(username)
        return jsonify(result = hiscore_data)
    except Exception as e:
        return str(e)

HTML: (once button clicked t should scroll to 2nd section called "skills")

<form class="hiscore_query">
    <input type="text" placeholder="username" name="username" id="username" autocomplete="off">
    <a href="#skills" id="process_input"><button><i class="fa fa-search"></i></button></a>
</form>

and the AJAX is:

$(function () {
    $('a#process_input').bind('click', function () {
        $.getJSON('/_background_hiscore_process', {
            username: $('input[name="username"]').val(),
        }, function (data) {
            for (const key in data.result){
                console.log("TEST :" +  key)
                $("#" + key + "_rank").text("Current rank: " + data.result[key][0]);
                $("#" + key + "_lvl").text("Current level: " + data.result[key][1]);
                $("#" + key + "_xp").text("Current XP: " + data.result[key][2]);
            }
        });
        return false;
    });
});

In all of my other section/navigation bar I use the smooth-scroll library from here which works good in all other cases - link.

<script>
    var scroll = new SmoothScroll('a[href*="#"]');
</script>

Thank you