javascript – Use result of a user selected dropdown in another dropdown without reloading page-ThrowExceptions

Exception or error:

I’m new to flask and I’ve seen similar questions asked on SO and other forums, but I have yet to be able to implement those suggestions to fit my use case. Open to any input you might, like I said I’m new to flask. I have a home route with two dropdowns. I’d like to populate the second dropdown based on whatever the user chooses and I’d like to not reload the page after the first selection is made. I’ve read this can be done with AJAX, but I have no experience with it.

The following is the home route I wrote. The first dropdown has the elements in the environments list. Based on what the user chooses, I’d like to feed it through the retrieve_versions function, which evaluates to another list. I’d like to use the contents of that list in the second dropdown.

@app.route("/home", methods = ['GET', 'POST'])
def choose():
    """ Home route.  User chooses desired environment and model """
    environments = ['a', 'b', 'c', 'd']
    # Would like to get placeholder based on the environment the user chooses
    versions = retrieve_versions(str(placeholder))
    # versions should then populate next dropdown
    versions.sort()
    return(render_template('home.html', envs = environments, versions = versions))

And the following is my HTML code:

<form method = "POST" action = "http://host/results">
    <select id = get_env name= envs method="POST" action="/">
        {% for env in envs %}
        <option value= "{{env}}" SELECTED>{{env}}</option>"
        {% endfor %}
    </select>
    <div>
        &nbsp; 
        &nbsp; 
    </div>
        <b>Choose Version</b>
        <div>
        </div>

        <select name= versions method="POST" action="http://host/results">
            {% for version in versions %}
            <option value= "{{version}}" SELECTED>{{version}}</option>"
            {% endfor %}
        </select>
    <p><input type = "Submit" value = "submit" /></p>

Is this possible, how might I do this?

How to solve:

Leave a Reply

Your email address will not be published. Required fields are marked *