使用 flask/ajax 从 Dropbox 菜单中检索选定的选项

【问题标题】：retrieve selected option from dropbox menu using flask/ajax使用 flask/ajax 从 Dropbox 菜单中检索选定的选项
【发布时间】：2021-12-30 02:29:06
【问题描述】：

我正在尝试从下拉菜单中检索所选选项。但它似乎没有给我任何回报。我尝试使用 ajax 发布选定的值，但效果不佳。请赐教。

$.ajax({
    url:"/dashboard",
    type:"POST",
    data: {
Sel =data['Sel']
},
    error: function() {
        alert("Error");
    },
    success: function(data, status, xhr) {}})

在烧瓶中 request.method="POST":

@app.route('/dashboard',methods=['GET','POST'])
@login_required
def dashboard():
select= request.form.get('val')
# select= request.form.get('Sel')
print(select)

在html中：

<form action="/dashboard" method="POST" name="dashboardform" id="dashboardform">
  <div class="dropdown-menu">
    <p>Select Period </p>
    <select id="Sel">
      <option value="All"> All </option>
      {% for result1 in result[:] %}
      <option value="{{result1}}">{{result1}}</option>
      {% endfor %}
    </select>
  </div>
</form>

【问题讨论】：

请发minimal reproducible example。

标签： html ajax flask

【解决方案1】：

您收到None 是因为您试图以form 数据的形式接收数据，但在您发送到Flask 的JSON 请求中，您的ajax 方法的数据结构也需要是已修复，要在后端接收 JSON 数据，您需要这样做：

在您的ajax 方法结构中，data 参数如下所示：

$.ajax({
    url:"/dashboard",
    type:"POST",
    data: {'sel': data['Sel']}
},
    error: function() {
        alert("Error");
    },
    success: function(data, status, xhr) {}
})

在你收到request.json['sel']的flask代码中，你也可以使用request.get_json方法来接收你的JSON请求数据。

@app.route('/dashboard',methods=['GET','POST'])
@login_required
def dashboard():
    select= request.json['sel']
    print(select)

【讨论】：