如何在一个html页面中提交两个post,如何在同一个页面上从Django和Ajax获得多个post请求?...
我一整天都在为这事犯愁。似乎什么都没用。这是我的情况。在
我有一个Django表单,有两个字段:redirect_from,redirect_to。此表单有两个提交按钮:Validate和{}。当页面加载时,Submit被隐藏,只显示Validate。在
所以现在,当用户填充这两个字段并单击Validate时,我使用Ajax来确认这两个字段是相同的。如果是,则显示Save按钮。单击Save按钮应将表单保存到数据库中。我还添加了一个oninput监听器,这样在Ajax调用之后,如果用户试图更改数据,Save按钮将再次隐藏,他现在必须再次计算它。在
显然,使用Ajax应该很容易,但是我发现它非常困难和令人沮丧。到目前为止,我的代码是:
我的模板:form method="post">
{% csrf_token %}
{% include 'partials/form_field.html' with field=form.redirect_from %}
{% include 'partials/form_field.html' with field=form.redirect_to %}
Save
Validate
{% endblock %}
{% block extra_scripts %}
{{ block.super }}
$(document).ready(function() {
$("#submit").hide()
});
$('#id_redirect_to').on('input', function(){
$("#submit").hide()
});
console.log("hello")
//For getting CSRF token
function getCookie(name) {
var cookieValue = null;
if (document.cookie && document.cookie != '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
//For doing AJAX post
//When submit is click
$("#ajax_submit").click(function(e) {
console.log("Clicked")
e.preventDefault();
//Prepare csrf token
var csrftoken = getCookie('csrftoken');
//Collect data from fields
/*var email = $('#inputEmail').val();*/
var redirect_from= $('#id_redirect_from').val();
var redirect_to= $('#id_redirect_to').val();
console.log("URL from and to is", redirect_from, redirect_to)
/*var password = $('#inputPassword').val();*/
//Send data
$.ajax({
url : window.location.href, // the endpoint,commonly same url
type : "POST", // http method
data : { csrfmiddlewaretoken : csrftoken,
redirect_from : redirect_from,
redirect_to : redirect_to
/*password : password*/
}, // data sent with the post request
// handle a successful response
success : function(json) {
console.log(json); // another sanity check
//On success show the data posted to server as a message
if (json['redirect_success'] === 'true')
{
alert("They are the same!" +json['redirect_success'] +'!.' );
$("#submit").show()
}
else
{
$("#submit").hide() //Maybe display some error message in the future!
}
},
// handle a non-successful response
error : function(xhr,errmsg,err) {
console.log(xhr.status + ": " + xhr.responseText); // provide a bit more info about the error to the console
}
});
});
{% endblock extra_scripts %}
我的观点:
^{pr2}$
我得到了500: MultiValueDictKeyError at "'Save'"
有人能把我引向正确的方向吗?对ajax很陌生。在
如何在一个html页面中提交两个post,如何在同一个页面上从Django和Ajax获得多个post请求?...相关推荐
- html一个页面多个动画,如何在单个html页面中添加两个相同的adobe边缘动画?
我正在使用jQuery手机,其中不同的网页内容将在一个HTML页面.如何在单个html页面中添加两个相同的adobe边缘动画? 在页面变化(滑动页面)上,其他页面具有相同的边缘动画,因为所有的html ...
- python 如何在一个for循环中遍历两个列表
是我在看<笨方法学python>过程中发现有一行代码看不懂--" for sentence in snippet, phrase:",所以研究了半天,感觉挺有收获的.所 ...
- HTML页面中使两个div并排显示如何实现
本文主要介绍了HTML页面中使两个div并排显示的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着微点阅读小编来一起学习学习吧 在HTML中实现两 ...
- 关于页面自动提交两次的问题(360浏览器)
本文转载自:http://blog.csdn.net/wcj1981/article/details/3912313 这几天在写一个功能模块,就是用户根据自己的查询条件导出excel数据. 自从程序写 ...
- 如何在一个html页面中引入另一个html页面
1.分别写出两个html页面01.html和02.html <!DOCTYPE html> <html lang="en"> <head>< ...
- HTML页面中使两个div并排显示
在HTML中实现两个div并排显示,方法如下: 方法1:设置float浮动 对需要并排显示的div设置样式:style="float:left;" <div style=&q ...
- 在一个.net sln中包含多个project,project引用同一个dll导致的错误
在一个.net sln中包含多个project,其中四个project应用了同一个.net assamply:Lucene.Net.这四个project其中一个编译异常: ForumsDataSou ...
- vue中,点击button按钮后,页面上的input框再次自动获取焦点
需求:点击button按钮,录入成功后,页面上的input框自动聚焦,快速进行下一次录入,提高效率 开始尝试了几种方法都没有成功 一.首先想到的用vue指令 v-focus,然而没有成功 <In ...
- html 按钮ajax请求,使用单个提交按钮和Ajax在JSP中提交两个HTML表单
我的页面设计是这样的,我必须使用两种形式,单击即提交,然后保存到数据库,反之亦然.我在Struts2 Framework的JSP页面上使用了此工具,我尝试了Ajax解决方案,但它们对我不起作用. 这是 ...
最新文章
- Android更新Ui的几种方法
- 求解第K个斐波那契质数
- 北京协和医学院823计算机原理,2017年北京协和医学院放射医学研究所(天津)823计算机原理考研题库...
- 《微软应用架构指南》前言
- Newtonsoft.Json.dll序列化为json,null值自动过滤
- 【BZOJ1412】【codevs2351】狼和羊的故事,最小割
- Java 输入一个整数,计算它各位上数字的和。(注意:是任意位的整数)
- HWSD全球土壤数据下载
- jlink 与 swd 接口定义
- 基于MATLAB的数字图像处理-图像进行灰度化
- 如何成为一名机器学习算法工程师?
- python的索引与切片
- linux中文件颜色,蓝色,白色等各代表含义
- 2012年8月11日
- TestNG-学习笔记
- 深入理解哈希表(JAVA和Redis哈希表实现)
- 【Python机器学习】标注任务与序列问题讲解(图文解释)
- wpa_supplicant 介绍
- 如何打开使用的mdw的access数据库文件
- Jmeter安装手记
热门文章
- @JsonSerialize 使用:注解方式 实现条件判断属性值、条件修改属性值
- FastJson 中 jsonArray 转换成 list 集合的方法
- javax.ws.rs.NotSupportedException: Cannot consume content type
- TOAD连接Oracle数据库失败:OCI_INVALID_HANDLE解决
- AutoHotkey调用VBA实现批量精确筛选数据透视表某字段内容。
- jQuery高度及位置操作
- WatiN-Html元素的操作
- 蓝懿IOS委托模式代理模式
- php计算代码运行时间与内存使用的一段代码
- [引]生成加密和解密的密钥