Question

我在烧瓶中有两段jquery代码。一个是工作，另一个不工作。我有一个表单和一个按钮，通过ajax调用相同的功能。现在，他们为故障排除目的调用相同的功能。按钮效果很好。表格不起作用。通过工作，我的意思是获得警报。我没有看到任何错误

HTML - 按钮

<div>
  <button class="#" id="getData" type="button">Get Data</button>
</div>

HTML - 表单

<form class="#" action="#" id="dataForm">
   <div class="#">
      <input class="#" id="title" />
      <button class="#" type="submit">Submit</button>
   </div>
</form>

表单和按钮的JQUERY

$(document).ready(function(){
  $("#dataForm").submit(function(){
    // alert("in dataform submit")
    $.ajax({
       url: "/getData"
    })
    .success(function(data){
      alert(data);
    });
  });
  $('#getData').click(function(){
    $.ajax({
      url: "/getData"
    })
    .success(function(data){
      alert(data);
    });
   });
}); //end doc ready

PYTHON /瓶

@app.route('/getData', methods=['GET' , 'POST'])
def getData():
    return('in getData - from Flask')

如果我删除dataForm submit（jquery）中的注释警报，我会按预期获得该警报。所以它进入了提交功能。它似乎没有进入ajax。我希望得到一个警告“在getData中 - 来自Flask “。我用按钮得到了它，但我没有得到表格。表格没有提交任何东西，因为我想让ajax（返回警报的数据）首先工作。我确信它是我缺少或不理解的简单事物。谢谢

Answer 1

在<form>标记中，您必须正确提及方法和操作属性，如下所示：

<form class="#" action="/getData" id="dataForm" method="post">

同样地，提及ajax请求的类型是明智的：

$.ajax({
        ...
       type:'POST'
       url: "/getData"
       ...
       ... 
    })
     ....

您可以拥有ajax .post文档here

另外，不要忘记在ajax调用中添加event.preventDefault（）。

表单提交经文按钮使用ajax传递数据 - 一个工作，另一个没有

1 个答案: