尽管正确调用了函数,但页面未在Flask中呈现

时间:2020-03-22 17:02:10

标签: javascript python html ajax flask

我正在使用Flask模板创建一个表,其中的行由数据库填充。单击相应的编辑按钮时,我试图编辑这些行之一。当前,代码遍历数据库结果并填充表,并在每行上附加一个按钮。单击按钮后,将调用一个脚本,该脚本使用ajax调用我的python函数,该函数应该处理输入并将页面重定向到edit.html。一切都被正确调用,但是页面只是刷新并停留在table.html上,永不离开。下面是代码

@app.route('/tables.html', methods=['GET','POST'])
def questions():
   table = list(getAllQuestions())
   if(request.method == 'GET'):
       return render_template('layouts/default.html',
                              content=render_template( 'pages/tables.html', value=table,), value=table)

def getAllQuestions():
   conn = mysql.connect()
   cursor = conn.cursor()
   cursor.execute("SELECT * FROM tbl_questions")
   data = cursor.fetchall()
   data = data[:10]
   return data
@app.route("/edit.html", methods=['GET', 'POST'])
def edit():
   print("in edit")
   form = RegisterForm(request.form)
   return render_template('pages/edit.html', form=form)
@app.route('/background_process_test', methods=["GET", "POST"])
def background_process_test():
   return redirect(url_for('edit'))

html和js

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type=text/javascript>
function clickfunction(value) {
console.log(value)
var resp = {
    'value': value
    }
console.log(resp)

$.ajax({
url: "/background_process_test",
type: 'POST',
contentType: 'application/json; charset=utf-8',
data: JSON.stringify(value),
dataType: 'json',
success: function(response) { alert(response); }
})
}
</script>

      <div class="panel-header panel-header-sm">
      </div>
      <div class="content">
        <div class="row">
          <div class="col-md-12">
            <div class="card">
              <div class="card-header">
                <h4 class="card-title"> Questions </h4>
              </div>
              <div class="card-body">
                <div class="table-responsive">
                  <table class="table">
                    <thead class=" text-primary">
                      <th>
                       Question
                      </th>
                      <th>
                       Round
                      </th>
                    </thead>
                    <tbody>
                      {% for row in value %}
                         <tr id="table">
                           <td>{{row[0]}}</td>
                            <td>{{row[1]}}</td>
                            <td>{{row[2]}}</td>
                             <td><form><a><button class='editButtons' value={{row[0]}} onclick="clickfunction({{ row[0] }})">Edit</button></a></form> </td>
                         </tr>

                      {% endfor %}
                    </tbody>
                  </table>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

相应的输出是

in edit
127.0.0.1 - - [22/Mar/2020 12:58:03] "GET /edit.html HTTP/1.1" 200 -
127.0.0.1 - - [22/Mar/2020 12:58:04] "GET /tables.html HTTP/1.1" 200 -

运行所有这些命令后,“处于编辑状态”确实会记录到控制台,但是页面永远不会呈现。相反,表格页面只是刷新,似乎没有任何反应,正如您可以在编辑后的GET请求中告诉的那样。我确定我犯了一些愚蠢的错误,但这是我的第一个烧瓶项目(老实说也是第一个Web项目,从未使用过js)。如果需要澄清任何问题,或者需要更多代码来了解围绕该问题的情况,请告诉我,我会澄清

0 个答案:

没有答案