背景：页面表单post请求后，不管是成功与否，都希望有相应的数据返回，提示用户操作成功，失败，禁止等等，但是在之前的文章form和ajax表单提交方式的区别中有提到过这两种请求方式的一些区别，这篇文章将讲一讲两种表单提交方式在返回数据方面的区别。
几点需求：
1、一个表格页面，我们希望在删除某一项，或增加一项时会返回列表页，类似于刷新，实时展示更新状态
2、如果要删除的某一项是不允许删除的，弹出提示窗（这也是一种返回）
针对上面两点需求，下面给出解决方案，两种需求分别对应不同的post请求方式。
需求1：如果要在执行完结果后，前端页面展示执行结果页面，或者重定向到某一个页面，需要使用form表单提交的方式
比如，要向数据库插入一条记录，并在完成之后返回插入完成的结果页面，下面是用返回flask中的render_template函数来返回结果页面的，但是这样返回的结果页面只是进行页面展示，而浏览器显示的url并没有更新，还是原先添加记录所使用的url，这样导致的结果就是刷新页面时会提示是否重复提交表单。
case_obj = TestCaseInfo(type_value=3,
name=file.filename.split('.')[0],
belong_project=project,
belong_module=module,
include=None,
author=author,
request_data=tests_list,
file_path=os.path.join(os.getcwd(), project, module, filename),
)
db.session.add(case_obj)
db.session.commit()
#表单分页处理
case = TestCaseInfo.query.filter(TestCaseInfo.type_value.in_([1,3])).all()
project = ProjectInfo.query.all()
module = ModuleInfo.query.all()
pager_obj = Pagination(request.args.get("page", 1), len(case), request.path, request.args,
per_page_count=10)
case = case[pager_obj.start:pager_obj.end]
html = pager_obj.page_html()
#返回渲染页面
return render_template('case_list.html',
username=addcase,
now_account=addcase,
case=case,
project=project,
module=module,
html=html,
)
如果是用下面这种方式返回结果页面，那么页面实时更新了，同时url也更新了，刷新页面不会有重复提交表单的提示了。
case_obj = TestCaseInfo(type_value=2,
name=config_name,
belong_project=project,
belong_module=module,
include=None,
author=author,
request_data=None,
file_path=os.path.join(os.getcwd(), project, module, filename),
)
db.session.add(case_obj)
db.session.commit()
#这里没有表单分页处理，是因为直接重定向后，url所指向的路由函数本身定义了分页处理，并返回结果页面。
url = '/api/{conflist}/config_list/1/'.format(conflist=addcase)
return redirect(url)
需求2：如果要在执行过程中进行判断是否允许执行该操作，并返回数据给前端操作弹窗等，需要使用ajax表单提交的方式
比如，我们要删除表单中的某一条记录，但是这条记录因为某种原因不允许删除，就会在页面弹出提示框不许与删除
服务端代码：在deleteconfig中执行删除，并返回删除操作执行结果
def delete_config(delete):
if delete in session.keys() and session[delete]['login_status'] == True:
if request.method == 'POST':
id = request.json['id']
type_value = eval(request.json['type'])
alert = deleteconfig(id, type_value)
if alert:
return alert
else:
return "删除成功！"
else:
return redirect("/api/login/")
前端js代码：服务端返回的数据，会传递到前端js脚本中，前端对返回的数据进行判断，并执行相应的操作（比如弹窗提醒等）
<script>
function post_del(URL, PARAMS) {
if (confirm("确认删除么？删除后不可恢复！")){
var url = URL;
var data = PARAMS;
$.ajax({
type:'post',
url:url,
data:JSON.stringify(data),
contentType:'application/json',
success: function (data) {
if (data ==='该配置被引用，无法删除！'){
alert(data);
}
else {
alert(data);
window.location.reload();
}
}
});
}
else {
return;
}
}
</script>