首页 > 代码库 > Asp.Net+Extjs实现登录

Asp.Net+Extjs实现登录

2024-07-25 16:09:23   209人阅读

      通过对Ext的学习，发现学习分三部曲：1.看官网的Demo，宏观了解Ext能做什么；2.看相关书籍，做理论指导；3.实现官网的Demo，体会Ext的真谛。

   在完毕了第一、二部后，如今我们须要做的是实现第三步，我的目标效果是用Extjs画页面，用Asp.Net的一般处理程序做后台server实现登录功能。

   宏观上的指导有了，以下进行细分，我整理了实现过程，思路例如以下：

   1.画一个登录的Panel--loginPanel；
   2.定义一个检測是否登录成功的函数CheckLogin；
   3.定义一个登录窗口--win，将loginPanel加入到登录窗口中；
   4.在登录窗口中加入“确定”和“取消”，为“确定”button绑定登录验证函数CheckLogin；  
   5.为登录窗口绑定一个最小化事件；
   6.定义一个登录成功弹出新窗口函数loginSuccess

   有了理论指导，以下进行代码实现：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <link href=http://www.mamicode.com/"css/ext-all.css" rel="stylesheet" type="text/css" />>
      后台Extjs一般处理程序的代码实现：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace Demo
{
    /// <summary>
    /// Extjs 的摘要说明
    /// </summary>
    public class Extjs : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            string userName = context.Request.QueryString["userName"];
            string userPass = context.Request.QueryString["passWord"];
            if (userName == "quwenzhe" && userPass == "123")
            {
                context.Response.Write("ok"); //假设验证成功则返回ok   
            }
            else
            {
                context.Response.Write("fail");//假设验证失败则返回fail   
            }
            context.Response.End();

        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}
     代码的运行过程：当点击确定button后，会触发CheckLogin函数，CheckLogin通过Ajax将获取的数据传到Extjs一般处理程序进行检验，并获取Extjs一般处理程序的返回值。假设返回值是ok，则调用loginSuccess函数弹出新窗口；否则，则弹出登录失败的提示。
   执行代码后，登录页面效果图例如以下：
     
    登录成功后的效果图例如以下：
    
    到此，用Extjs实现的登录功能已经完毕。此外， 在学习过程中，发现自己存在浅尝辄止的问题，刚学会一点就以为自己明确了，希望大家能引以为戒，不要犯相同的错误。
    Ext是个非常好的框架，学好它在非常大程度上能帮助我们学习DWZ，希望大家能用心学习这块。
     

Asp.Net+Extjs实现登录


联系
我们