-------------------------------------------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#后台交换数据的更多相关文章

  1. 8.ajax与django后台json数据的交互

    1新建django项目名为json_ajax,应用名为app,在templates模板中新建ajax.html文件 ajax.html <!DOCTYPE html> <html l ...

  2. ashx 获取ajax Post到后台json数据

    前台页面代码: var json = [{ "Name": "Pavan Kumar Pabothu", "Age": 27, " ...

  3. jsp与后台交换数据(安全目录外)

    function changebasin(rivername,codepollute){ $.ajax({ type: "POST", url: "${ctx}/wate ...

  4. ajax中的后台返回数据data的意义

  5. node学习笔记(二)(ajax方式向node后台提交数据)

    通过ajax向node后台提交数据过程(附手写前后台代码),并总结post与get的区别 POST 前台代码 //CSS简单给点样式 <style> form{ width: 200px; ...

  6. 【spring 后台跳转前台】使用ajax访问的后台,后台正常执行,返回数据,但是不能进入前台的ajax回调函数中

    问题: 使用ajax访问的后台,后台正常执行,并且正常返回数据,但是不能进入前台的ajax回调函数中 问题展示:  问题解决: 最后发现是因为后台的方法并未加注解:@ResponseBody,导致方法 ...

  7. jquery ajax提交json格式的数据,后台接收并显示各个属性

    我的表单如下: <form onsubmit="return false"> <ul> <li><span>用户名</span ...

  8. 通过ajax和spring 后台传输json数据

    在通过ajax从页面向后台传数据的时候,总是返回415(Unsupported media type)错误,后台无法获取数据.如下图所示: 在尝试解决这个问题的时候,我们首先要理解一下概念: @req ...

  9. Jquery EasyUI +Ajax +Json +一般处理程序 实现数据的前台与后台的交互 --- 善良公社项目

    经过上一篇博客,本节主要是来看实现的功能是后台的数据通过json数据传过来,前台修改的数据再传回数据库之后页面再次更新table中的数据: 图示: 实例:前台的代码 <%--表格显示区--%&g ...

随机推荐

  1. 引入maven以外的jar包

    这里有2个案例,需要手动发出Maven命令包括一个 jar 到 Maven 的本地资源库. 要使用的 jar 不存在于 Maven 的中心储存库中. 您创建了一个自定义的 jar ,而另一个 Mave ...

  2. Ionic -v1初始项目结构

    界面  

  3. es6 promise 结束回调地狱

    promise的三种状态: pending---进行中 fulfiled---执行成功 rejected---执行失败 var promise = new Promise(function(resol ...

  4. Linux时间命令date

    date:打印当前时间 date "+定制信息":自定义格式打印时间 - date "+%H":打印当前时间的小时数 - date "+%H%M%S& ...

  5. 点击按钮时,显示不同的div内容

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. [转]Oracle 11g 基于CentOS7静默安装教程(无图形界面,远程安装) --有部份地方有问题

    Oracle 11g 基于CentOS7静默安装教程(无图形界面,远程安装) [转载]原文地址:http://canonind.blog.51cto.com/8239025/1883066 一.安装前 ...

  7. zabbix3.4.8中提示host [4gronghe_110] not found

      查看zabbix_agentd.log时出现下列错误 [root@4gronghe_110 ~]# tail /var/log/zabbix/zabbix_agentd.log 1266:2014 ...

  8. powerdesigner数据库设计

    (1)创建物理数据模型 打开PowerDesigner,然后点击File-->New  Model然后选择如下图所示的物理数据模型(物理数据模型的名字自己起,然后选择自己所使用的数据库即可) ( ...

  9. 获取用户真实IP:(模拟:客户端--F5--nginx--tomcat 后端获取用户真实IP)

    模拟:客户端--F5--nginx--tomcat 后端获取用户真实IP 192.168.109.137 :nginx01(充当第一层代理==F5)192.168.109.138 :nginx02(二 ...

  10. python的type和object

    在python中一切皆对象,这是个用python的人都知道的概念,以int举例,比如a=2,type下: 发现他的type是int,在python中type就是类,所以a是类int的一个对象,实例是类 ...