<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!-- easyui的样式 -->
<link rel="stylesheet" type="text/css" href="../js/jquery-easyui-1.3.1/themes/default/easyui.css">
<!-- 小图标的样式 -->
<link rel="stylesheet" type="text/css" href="../js/jquery-easyui-1.3.1/themes/icon.css">
<script type="text/javascript" src="../js/jquery-easyui-1.3.1/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="../js/jquery-easyui-1.3.1/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../js/jquery-easyui-1.3.1/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">
var loginAndRegDialog;
$(function(){
loginAndRegDialog = $('#loginAndRegDialog').dialog({
closable:false,
modal : true,
buttons : [{
text : '登录',
handler : function(){
$.ajax({
type : "POST",
url : 'http://localhost:81/sdsweb/userMgr/user/login.action',
data : {
uname : $('#loginAndRegDialog input[name=name]').val(),
password : $('#loginAndRegDialog input[name=password]').val()
},
//data : $('loginAndRegForm').serialize(),
//dataType指定以后,r的值就是对应的类型,比如dataType指定成json以后,jquery就会把返回的字符串转换成json对象,r也就是json对象了
dataType : 'text',
success : function(r){
alert(r);
},
error : function(){
//$.messager.alert('Warning','The warning message','error');
//从右下角慢慢弹出来
$.messager.show({
title : '提示',
msg : '登录失败'
});
}
});
}
},{
text : '注册',
handler : function(){
alert("注册");
}
}]
});
});
</script>
</head>
<body>
//用dialog的形式展现表单
<div id="loginAndRegDialog" class="easyui-dialog" title="用户登录" style="top:100px;width:400px;height:200px;">
<form id="loginAndRegForm">
<table>
<tr>
<th>
用户名
</th>
<td>
<input name="name" />
</td>
</tr>
<tr>
<th>
密码
</th>
<td>
<input name="password" type="password" />
</td>
</tr>
</table>
</form>
</div>
</body>
</html>
相关推荐
本文将详细介绍如何利用AJAX提交表单的完整流程,以实现更加流畅和用户友好的交互体验。 ### 1. 创建HTML表单 首先,我们需要创建一个HTML表单,它包含了用户输入的数据和一个用于触发AJAX提交的按钮。例如: ```...
### 一、前端:使用jQuery的AJAX提交表单 1. **引入jQuery库**:首先确保在HTML文件中引入了jQuery库。可以使用CDN链接或本地文件,例如: ```html <script src="https://code.jquery.com/jquery-3.6.0.min.js">...
在“ajax提交表单”这个场景中,我们需要关注的是POST请求,因为表单提交通常涉及到向服务器发送数据。以下是使用JavaScript实现的一个简单例子: ```html <!DOCTYPE html> <title>AJAX提交表单示例 请...
在本教程中,我们将深入探讨如何在Vue 1.x和2.x版本中使用Ajax提交表单。 **Vue 1.x 和 Vue 2.x 的核心差异** Vue 2.x 对于Vue 1.x进行了一些关键性的改进,包括优化性能、引入虚拟DOM以及对组件API的调整。然而,...
完整的jq ajax提交表单,奖解压后jq文档加入页面中,调用就可惟了。 表单结构 <form id="myForm" action="comment.php" method="post"> Name: <input type="text" name="name" /> Comment: <...
接下来,我们将深入探讨Asp+Ajax提交表单的实例,以及如何实现这一功能。 首先,我们需要理解Ajax的核心概念。Ajax并非一种编程语言,而是利用JavaScript、XMLHttpRequest对象和DOM(Document Object Model)来实现...
总结来说,本示例的"完成的Ajax提交表单"展示了如何使用Ext JS结合Ajax技术,实现无刷新的表单提交,提高Web应用的响应速度和用户体验。通过理解和实践这些知识点,开发者可以更好地构建交互性更强的Web应用程序。
在“使用jQuery ajax提交表单代码”的资源中,我们可以期待看到一个清晰的示例,展示如何将表单数据发送到服务器,并处理响应。 1. **jQuery的$.ajax()函数** - **基本语法**:`$.ajax({ options });` - **选项...
一、AJAX提交表单基础 1. **异步性**:AJAX的核心是XMLHttpRequest对象,它可以在后台与服务器通信,而不会干扰用户的界面操作。这意味着用户可以继续浏览页面,而数据正在后台处理。 2. **JSON与XML**:虽然最初...
这是一个ajax提交表单插件,支持文件上传,用起来非常方便。具体使用说明 http://blog.csdn.net/qq122453418/article/details/79511164 欢迎留言
开门见山,因为laravel以post形式提交数据时候需要加{{csrf_field()}}防止跨站攻击,所以当你用ajax提交表单时候自然也要加。 在网上看了很多的解决方式,我是用下面这种方法解决的: 1,首先在模板里面加上一个meta : ...
在本文中,我们将通过一个实例来分析如何使用AJAX提交表单数据,并深入探讨其实现原理和技巧。 首先,我们需要注意AJAX请求的两种主要类型:GET和POST。GET请求通常用于从服务器检索数据,而POST请求则通常用于向...
总结来说,Ajax提交URL适用于简单且少量的数据交互,而Ajax提交表单更适合处理包含多个字段的复杂表单数据,能够提供更好的用户体验。在实际应用中,开发者应根据具体需求选择合适的方法,并注意处理可能出现的错误...
本教程将详细讲解如何利用jQuery、jQuery Form插件以及Spring MVC框架来实现Ajax提交表单并上传图片。通过这种方式,用户无需等待页面刷新,即可完成操作,提升了交互性。 首先,`jquery.js` 是jQuery库的核心文件...
本文实例讲述了jQuery使用$.ajax提交表单的方法。分享给大家供大家参考,具体如下: 首先,新建Login.html页面: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...
1. **安全性**:使用Ajax提交表单时需要注意安全问题,如CSRF攻击,确保请求是来自合法的来源。 2. **用户体验**:虽然同步请求可以立即得到结果,但会阻塞UI,降低用户体验。推荐使用异步请求。 3. **错误处理**:...
jQuery.form.js是一个form插件,支持ajax表单提交和ajax文件上传.
在这个“Ajax使用jQuery提交表单 文件”中,我们将探讨如何利用jQuery实现Ajax提交表单,从而实现异步数据传输,提高用户体验。 首先,我们需要理解jQuery中的Ajax函数`$.ajax()`。这是一个核心函数,可以进行各种...
其中,使用AJAX实现无刷新数据交互是一个关键技术点,本文将详细介绍ThinkPHP5中如何使用AJAX提交表单,并提供相关的实例分析。 首先,要进行AJAX表单提交,我们通常使用jQuery提供的ajax()方法。这个方法可以让...