ajax提交form表单
1. ajax提交form表单和不同的form表单的提交主要区别在于,ajax提交表单是异步提交的,而普通的是同步提交的表单。
2. from视图部分
<form id="loginForm" name="loginForm" action="admin/user/login" method="post">
<table align="center">
<tr>
<td>用户名:</td>
<td colspan="2"><input type="text" name="username" id="username" /></td>
</tr>
<tr>
<td>密 码:</td>
<td colspan="2"><input type="password" name="password" id="password" /></td>
</tr>
<td colspan="3" align="center">
<input id="login_submit_button" type="submit" value="登录"/>
</td>
</tr>
</table>
16 </form>
3. ajax提交
//加载js
<script src = "../js/jquery-1.4.min.js" type = "text/javascript"></script>
<script type = "text/javascript">
$('#loginForm').on('submit', function (e){
e . preventDefault();
$.ajax( {
type : "POST",
dataType: "json",
url : 'url',
data : $(this) . serialize(),
success : function (res) {
console . log(res)
if (res . type == 'ok') {
alert(res . msg);
//成功后跳转路由设置
window . location . href = '';
} else {
if (res . type == "no") {
alert(res . msg);
}
}
}
});
});
</script>
4. 后台处理(php)
//首先判是否有ajax提交
if (!Yii::app()->request->isAjaxRequest)
{
Yii::app()->end();
} $model = new XXX; if (isset($_POST['FrontLogin'])) {
//像一般的form提交取值
$model->username = $_POST['FrontLogin']['username'];
$model->password = md5($_POST['FrontLogin']['password']);
$model->verifyCode = $_POST['LoginForm']['verifyCode']; // validate user input and redirect to the previous page if valid
if ($model->validate() && $model->login()) {
//以echo形式返回数据
echo CJSON::encode(array('type' => 'ok', 'msg' => '登陆的成功')); } else {
echo CJSON::encode(array('type' => 'no', 'msg' => '登陆失败'));
} }
ajax提交form表单的更多相关文章
- ajax提交form表单资料详细汇总
一.ajax提交form表单和不同的form表单的提交主要区别在于,ajax提交表单是异步提交的,而普通的是同步提交的表单.通过在后台与服务器进行少量数据交换,ajax 可以使网页实现异步更新.这意味 ...
- jquery实现ajax提交form表单的方法总结
本篇文章主要是对jquery实现ajax提交form表单的方法进行了总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 方法一: function AddHandlingFeeToRefund( ...
- jquery的ajax提交form表单方式总结
方法一: function AddHandlingFeeToRefund() { var AjaxURL= "../OrderManagement/AjaxModifyOrderServic ...
- Ajax提交Form表单的一种方法
待提交的表单 <form id="updatePublicKey" enctype="multipart/form-data"> <div c ...
- ajax提交form表单问题
form表单提交数据可以省下大量大量获取元素的代码,局部刷新时也可以用ajax提交form表单,但是要先把表单序列化,再把后台javaBean对象序列化,但是你有可能前后台都执行了系列化,但是后台还是 ...
- Ajax提交form表单内容和文件(jQuery.form.js)
jQuery官网是这样介绍form.js A simple way to AJAX-ify any form on your page; with file upload and progress s ...
- 使用ajax提交form表单,包括ajax文件上传【转载】
[使用ajax提交form表单,包括ajax文件上传] 前言 转载:作者:https://www.cnblogs.com/zhuxiaojie/p/4783939.html 使用ajax请求数据,很多 ...
- 使用ajax提交form表单,包括ajax文件上传 转http://www.cnblogs.com/zhuxiaojie/p/4783939.html
使用ajax提交form表单,包括ajax文件上传 前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },&qu ...
- jquery实现ajax提交form表单的方法总结(转)
方法一: 复制代码 代码如下: function AddHandlingFeeToRefund() { var AjaxURL= "../OrderManagement ...
随机推荐
- xv6课本翻译之——附录A Pc的硬件
Appendix A 附录A PC hardware Pc的硬件 This appendix describes personal computer (PC) hardware, the platfo ...
- Python 【第七章】:Html 和 CSS
HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写,他是一种制作万维网页面标准语言(标记).相当于定义统一的一套规则,大家都来遵守他,这样就可以让浏览器根据标 ...
- setTimeout 和 throttle 那些事儿
document.querySelector('#settimeout').onclick= function () { setTimeout(function () { console.log('t ...
- Chrome 开发工具之Timeline
之前有说到Element,Console,Sources大多运用于debug,Network可用于debug和查看性能,今天的主角Timeline更多的是用在性能优化方面,它的作用就是记录与分析应用程 ...
- CSS-垂直|水平居中问题的解决方法总结
题外话:前两天和专业老师探讨最近的一个项目,涉及到对一个浮动的盒子局中的问题,老师的解决方法打开了我的新思路.让我有了总结一下平时的居中问题的想法.不然可能忘掉了以后又要到处寻找解决办法了.另外也给我 ...
- EditPlus-CN使用总结
EditPlus-CN使用总结 --------------- 注册名:Free User注册码:6AC8D-784D8-DDZ95-B8W3A-45TFA ---------------- 1.如何 ...
- Ajax方式上传文件
用到两个对象 第一个对象:FormData 第二个对象:XMLHttpRequest 目前新版的Firefox 与 Chrome 等支持HTML5的浏览器完美的支持这两个对象,但IE9尚未支持 For ...
- maven阿里云中央仓库
配置 修改maven根目录下的conf文件夹中的setting.xml文件,内容如下: <mirrors> <mirror> <id>alimaven</id ...
- 开源项目GitHub
GitHub 手把手教你如何加入到github的开源世界! http://www.open-open.com/lib/view/open1396580186465.html 如何在 Github 上发 ...
- js中数组去除重复项目
js语法技巧:if(a>=5) alert(); 可以改写成下边语句: a>=5&&alert(); 在下文中会用到这种写法 // for循环删除后面重复的 速度最快 ...