Flask request not returning any info from select

Question

I'm trying to set up a simple select dropdown form with Flask. Based on the option chosen, I grab different data from my database, and display it back into a div on my html template. But I can't seem to get the Flask request to register any of the select options. When I print request.form or request.args, I always get empty Dicts. It's probably something simple I'm missing but I can't seem to find the problem. I've gotten this to work with several input and button forms, but I can't get it to work right for selects.

Here is a bit of my html template code, with the form and select. I've tried both GET and POST method in the form.

<div class="options" id="options">
    <form class="form-horizontal container-fluid" role="form" method="GET" action="exploresn2.html">
        <div class="form-group">
            <label for="xaxis" class="col-sm-2 control-label">X-axis:</label>
            <div class="col-sm-2">
                <select name="xaxis" class="form-control" id="xaxis">
                    <option selected value="mjd" id="mjd">MJD</option>
                    <option value="seeing" id="seeing">Seeing</option>
                    <option value="airmass" id="airmass">Airmass</option>
                    <option value="hourangle" id="hourangle">Hour Angle</option>
                </select>
            </div>
        </div>
    </form>         
</div>

In Flask, at first, I tried inside my app

 import flask
 from flask import request, render_template, send_from_directory, current_app

 explore_page = flask.Blueprint("explore_page", __name__)

 @explore_page.route('/exploresn2.html', methods=['GET','POST'])
 def explore():

      xaxis = str(request.args.get("xaxis", "any"))

      .... [populate new xaxis variable based on request option selected]

      exploreDict['xaxis'] = xaxis
      return render_template("exploresn2.html", **exploreDict)

or

mjd = valueFromRequest(key='mjd', request=request, default=None)
if mjd:
    mjds = [int(exp.platedbExposure.start_time/(24*3600)) for exp in exposures]
    xaxis = mjds

exploreDict['xaxis'] = xaxis

to look for and grab a specific values, or in the first case, any value select. The valueFromRequest is function that grabs data from either GET or POST requests.

but this returns nothing, and then I tried just printing the entire request.args (or request.form) and it returns and empty Dict. Everything I try it still returns empty Dicts. So I'm missing some set up somewhere I think but the form looks right to me?

Answer 1

I'm not sure if this is the actual answer to this problem that I was looking for, but here is what I came up with. I couldn't actually get the Flask to accept a GET request into the original explore method defined, so I implemented a new method in Flask to return a JSON object

@explore_page.route('/getdata', methods=['GET','POST'])
def getData(name=None):

     name = str(request.args.get("xaxis", "mjd"))
     xaxis = 'populate new xaxis data based on value of name'
     data = '(x,y) data array filled with values for plotting'
     axisrange = range of x,y data for axes for plot 

     return jsonify(result=data, range=axisrange)

and then I just made a GET request via javascript to that method whenever the select button changes. So in my exploresn2.html template I have (using Flot for plotting)

$("#xaxis").change(function(){

    var newname = $("#xaxis :selected").text();
    var axes = plot.getAxes();
    options = plot.getOptions();
    var plotdata = plot.getData();

    // make a GET request and return new data       
    $.getJSON($SCRIPT_ROOT + '/getdata', {'xaxis':$("#xaxis :selected").val()},
            function(newdata){
                // set new data
                for (var i = 0; i < plotdata.length; ++i) {
                    plotdata[i].data = newdata.result[plotdata[i].label];
                }
                // set new axes
                axes.xaxis.options.panRange = [newdata.range[0]-50,newdata.range[1]+50];
                axes.xaxis.options.axisLabel = newname;
                axes.xaxis.options.min = newdata.range[0]-1;
                axes.xaxis.options.max = newdata.range[1]+1;
                axes.yaxis.options.min = newdata.range[2];
                axes.yaxis.options.max = newdata.range[3];                  
                // redraw plot
                plot.setData(plotdata);
                plot.setupGrid();
                plot.draw();
            });                
});