标签：div methods wrap fun data- 跳转 var ESS edit
需求场景：有时候单纯的form表单无法向后端传递额外的参数 比如需要action传递js异步生成的参数 ，form表单默认的action就无法满足需求，这时就需要我们自定义form表单的提交方式。
html:(向后台传递对任务的评论内容，默认缺点：不能携带任务id)
1 <div> 2 <form action="#" id="form_comment"> 3 <textarea id="comment" required="required" class="form-control" name="comment" 4 data-parsley-trigger="keyup" data-parsley-minlength="20" data-parsley-maxlength="100" 5 data-parsley-validation-threshold="10" placeholder="评论......"></textarea> 6 <div style="padding: 4px 0 0 0"> 7 <button type="submit" class="btn btn-success" id=‘commentSb‘ 8 style="background: #fff;color: #0c0c0c;border-color: #CCC"><font 9 style="vertical-align: inherit;"><font style="vertical-align: inherit;">提交</font></font> 10 </button> 11 <button type="button" class="btn btn-primary" id=‘commentCel‘><font 12 style="vertical-align: inherit;float: right"><font 13 style="vertical-align: inherit;">取消</font></font></button> 14 </div> 15 </form> 16 </div>
js:(自定义提交方法)
1 $(document).ready(function(){ 2 function decodeQuery() { 3 var search = window.location.href; //获取跳转到本页面的路由 http://127.0.0.1:5000/task_mgm/taskinfo_editID=29 4 return search.split(‘=‘)[1].split(‘?‘)[0]; 5 } 6 // 获取任务id 7 var taskId = decodeQuery(); 8 // 提交评论 9 $("#form_comment").submit(function (event) { 10 event.preventDefault(); // 阻止form表单的默认提交路径：action指定的路径 11 var comment = $(‘#comment‘).val(); 12 var data = { 13 "comment": comment 14 }; 15 $.ajax({ 16 url: "/task_mgm/taskinfo_comment=" + taskId, // 可灵活传参 17 type: "POST", 18 data: JSON.stringify(data), 19 contentType: "application/json", 20 dataType: "json", 21 success: function (resp) { 22 if (resp.error == ‘OK‘) { 23 alert(‘评论成功‘); 24 $(‘#comment‘).val(‘‘); 25 } else { 26 alert(‘评论失败‘); 27 } 28 } 29 }) 30 }) 31 })
flask:
# 提交评论 @task_mgm.route(‘/taskinfo_comment=<int:num>‘, methods=[‘GET‘, ‘POST‘]) @sso_wrapper def taskinfo_comment_form_fun(num): req_data = request.get_json() # 获取json数据参数 comment = req_data.get(‘comment‘) comment = Comment(content=comment, taskId=num, userId=2) db.session.add(comment) db.session.commit() return jsonify(error=‘OK‘， emag=‘NO‘) # 返回数据json格式
标签：div methods wrap fun data- 跳转 var ESS edit
原文地址：https://www.cnblogs.com/We612/p/10190123.html
