jQury+Ajax与C#后台交换数据
-------------------------------------------jQury+Ajax调用后台方法-------------------------------------------
JS:
function CarState(carID) {
$.ajax({
type: "Post",
url: "ShowMap.aspx/GetCarState",
//方法传参的写法一定要对,str为形参的名字
data: "{'carid':'" + carID + "' }",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
//返回的数据用data.d获取内容
alert(data.d);
}
});
}
后台:
using System.Web.Script.Services;
using System.Web.Services;
[WebMethod]
public static string GetCarState(string carid)
{
return "Hello world!";
}
-------------------------------------------jQuery+Ajax提交表单-------------------------------------------
HTML:
<form id="form1" class="form form-horizontal" action="Login.aspx" method="post" style="margin-left:-10px;margin-top:-10px">
<div class="row cl" style="margin-top:60px;">
<div class="formControls col-8" style="margin-top:-5px;">
<input id="t_name" name="t_name" type="text" placeholder="账户" autocomplete="off" class="input-text size-L" value="" />
</div>
</div>
<div class="row cl">
<div class="formControls col-8" style="margin-top:-5px;">
<input id="t_pwd" name="t_pwd" type="password" placeholder="密码" autocomplete="off" class="input-text size-L" value="" />
</div>
</div>
<div class="row">
<div class="formControls col-8 col-offset-3">
<input id="b_submit" type="submit" class="btn btn-success radius size-L" value="登录" onclick="validate(); return false;" />
<span id="loading" class="btn btn-success radius size-L hidden">登录中...</span>
</div>
</div>
</form>
JS:
<script src="Scripts/jquery-1.11.3.js"></script>
<script src="Scripts/jquery.form.js" ></script>
<script src="Scripts/layer/layer.js"></script>
<script type="text/javascript">
function validate() {
if ($("#t_name").val() == "") {
layer.msg("请输入账户名!");
} else if ($("#t_pwd").val() == "") {
layer.msg("请输入密码!");
} else {
$("#form1").ajaxSubmit({
dataType: "json",
beforeSubmit: function () {
$("#b_submit").hide();
$("#loading").removeClass("hidden");
}, success: function (resp) {
if (resp.res == 1) { //登录成功
window.location.href = resp.data;
} else { //登录失败
$("#b_submit").show();
$("#loading").addClass("hidden");
$("#t_code").val("");
layer.msg(resp.msg);
}
}, error: function (e) {
$("#b_submit").show();
$("#loading").addClass("hidden");
}
});
}
}
//将光标定位到用户名输入框
window.onload = function () {
document.getElementById("t_name").focus();
}
</script>
C#后台(.aspx.cs文件)
protected void Page_Load(object sender, EventArgs e)
{
if (IsPost)
LoginUser();
}
private void LoginUser()
{
if (IsLocalRequest && !IsRepeatPost)
{
string loginname = GetFormString("t_name");
string loginpwd = GetFormString("t_pwd");
if (loginname == "")
ResponseText(Newtonsoft.Json.JsonConvert.SerializeObject(new { res = 0, msg = "请输入用户名!" }));
else if (loginpwd == "")
ResponseText(Newtonsoft.Json.JsonConvert.SerializeObject(new { res = 0, msg = "请输入密码!" }));
else
{
string str = Common.Utils.MD5(loginpwd.ToLower());
t_member model = MemberDal.m_MemberDal.GetModel(string.Format(" mb_name = '{0}' and mb_pwd='{1}'", loginname, Common.Utils.MD5(loginpwd.ToLower())));
if (model != null)
{
if (model.mb_islock == 1)
ResponseText(Newtonsoft.Json.JsonConvert.SerializeObject(new { res = 0, msg = "无法登录,该账户被锁定!" }));
else
{
model.mb_logintime = DateTime.Now.ToString();
model.mb_loginip = Request.UserHostAddress;
MemberDal.m_MemberDal.Update(model);
Response.Cookies[":member"].Value = Common.Serialize.SerializeObject(model);
Response.Cookies[":member"].Expires.AddDays(1);
ResponseText(Newtonsoft.Json.JsonConvert.SerializeObject(new { res = 1, msg = "登录验证通过", data = "/Master.aspx" }));
}
}
else {
ResponseText(Newtonsoft.Json.JsonConvert.SerializeObject(new { res = 0, msg = "账号或密码不正确!" }));
}
}
}
}
jQury+Ajax与C#后台交换数据的更多相关文章
- 8.ajax与django后台json数据的交互
1新建django项目名为json_ajax,应用名为app,在templates模板中新建ajax.html文件 ajax.html <!DOCTYPE html> <html l ...
- ashx 获取ajax Post到后台json数据
前台页面代码: var json = [{ "Name": "Pavan Kumar Pabothu", "Age": 27, " ...
- jsp与后台交换数据(安全目录外)
function changebasin(rivername,codepollute){ $.ajax({ type: "POST", url: "${ctx}/wate ...
- ajax中的后台返回数据data的意义
- node学习笔记(二)(ajax方式向node后台提交数据)
通过ajax向node后台提交数据过程(附手写前后台代码),并总结post与get的区别 POST 前台代码 //CSS简单给点样式 <style> form{ width: 200px; ...
- 【spring 后台跳转前台】使用ajax访问的后台,后台正常执行,返回数据,但是不能进入前台的ajax回调函数中
问题: 使用ajax访问的后台,后台正常执行,并且正常返回数据,但是不能进入前台的ajax回调函数中 问题展示: 问题解决: 最后发现是因为后台的方法并未加注解:@ResponseBody,导致方法 ...
- jquery ajax提交json格式的数据,后台接收并显示各个属性
我的表单如下: <form onsubmit="return false"> <ul> <li><span>用户名</span ...
- 通过ajax和spring 后台传输json数据
在通过ajax从页面向后台传数据的时候,总是返回415(Unsupported media type)错误,后台无法获取数据.如下图所示: 在尝试解决这个问题的时候,我们首先要理解一下概念: @req ...
- Jquery EasyUI +Ajax +Json +一般处理程序 实现数据的前台与后台的交互 --- 善良公社项目
经过上一篇博客,本节主要是来看实现的功能是后台的数据通过json数据传过来,前台修改的数据再传回数据库之后页面再次更新table中的数据: 图示: 实例:前台的代码 <%--表格显示区--%&g ...
随机推荐
- Django之模板(T)
一, 常用语法 Django模板中只需要记两种特殊符号: {{ }}和 {% %} {{ }}表示变量,在模板渲染的时候替换成值,{% %}表示逻辑相关的操作. 一, 变量 语法: {{ 变量名 }} ...
- PCIe基础篇(一)、基础知识扫盲
1.PCIe:Peripheral Component interconnect Expess,外围组件接口互联,属于第三代IO总线,PCIe的传输速率指的是实际的有效传输速率,为RAW data(原 ...
- menustrip
在对应菜单上点击鼠标右键,插入,SEPARATOR 就可以了,然后可以选中拖动位置.
- 05-CSS浮动、定位、页面布局
# 浮动 ### 文档流文档流,是指盒子按照html标签编写的顺序依次从上到下,从左到右排列,块元素占一行,行内元素在一行之内从左到右排列,先写的先排列,后写的排在后面,每个盒子都占据自己的位置. # ...
- vue报错TypeError: Cannot read property 'protocol' of undefined
错误信息如下所示: isURLSameOrigin.js?3934:57 Uncaught (in promise) TypeError: Cannot read property 'protocol ...
- 消灭 Java 代码的“坏味道”
消灭 Java 代码的“坏味道” 原创: 王超 阿里巴巴中间件 昨天 导读 明代王阳明先生在<传习录>谈为学之道时说: 私欲日生,如地上尘,一日不扫,便又有一层.着实用功,便见道无终穷,愈 ...
- Sql Server 出现此数据库没有有效所有者问题
在新建数据库或附加数据库后,想添加关系表,结果出现下面的错误: 此数据库没有有效所有者,因此无法安装数据库关系图支持对象.若要继续,请首先使用“数据库属性”对话框的“文件”页或ALTER AUTHO ...
- Java虚拟机——Class类文件结构
Class文件格式采用一种类似C语言结构体的结构来存储数据,这种数据结构只有两种数据类型:无符号数和表. 无符号数属于基本的数据类型,数据项的不同长度分别用u1, u2, u4, u8表示, ...
- tpcc-mysql测试mysql5.6 (xfs文件系统)
操作系统版本:CentOS release 6.5 (Final) 2.6.32-431.el6.x86_64 #1 内存:32G CPU:Intel(R) Xeon(R) CPU E5-2450 ...
- hashlib模块subprocess模块
'''通过一种算法,将字符串得出一种编码内容相同则hash运算结果相同,内容稍微改变则hash值改变不可逆推相同算法,无论校验多长的数据,得到的hash值长度固定'''# import hashlib ...