这种年代。。不会extjs真的很郁闷。。在google里找了找。。很多人都用extjs做了一个登陆。。
所以咱也做也个吧。。废话不多说。。现在咱也来做一个吧。。。
首先。。。下载extjs资源包。。加载到项目中。。
然后。。。新建aspx页面。。extjsTest.aspx
在extjsTest.aspx页面:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="extjsTest.aspx.cs" Inherits="Maticsoft.Web.Default" %> <!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 runat="server"> <title>extjstest</title> <link rel=stylesheet type="text/css" href="ExtJS/resources/css/ext-all.css" /> <script type="text/javascript" src="ExtJS/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="ExtJS/ext-all.js"></script> </head> <body> <form id="form1" runat="server"> <div> <script type="text/javascript"> function LoginDemo() { var loginPanel = new Ext.form.FormPanel({ id: "loginPanel", labelPad: 0, labelWidth: 40, frame: true, items: [ { xtype: "field", id: "UserName", fieldLabel: "用户名" }, { xtype: "field", id: "Password", fieldLabel: "密码" } ] }); var loginWindow; if(!loginWindow){ loginWindow=new Ext.Window ({ id:"loginWindow", title:"登陸窗口", width:200, height:127, resizable:false, closable:false, items: [ loginPanel ], buttons: [ {xtype:"button",text:"確定",handler:validatorData }, {xytpe:"button",text:"取消",handler:function(){loginWindow.hide(); } } ] }); } loginWindow.show(); document.body.onkeydown=function(){loginWindow.show(); }; function validatorData(){ var UserName = Ext.getCmp("UserName").getValue(); var Password = Ext.getCmp("Password").getValue(); if (Ext.util.Format.trim(UserName) == "" || Ext.util.Format.trim(Password) == "") { Ext.Msg.alert("警告", "请完整输入!"); return; } Ext.Ajax.request ({ url:"WebForm1.aspx", method:'GET', params: { ParamValue: "1", ParamUserName: UserName, ParamPassword: Password }, success: function(response, option) { var obj = Ext.util.JSON.decode(response.responseText); if(obj.success==true) { Ext.MessageBox.alert('信息',obj.msg); } else { Ext.Msg.alert("信息","出错啦!!"); } }, failure: function() { Ext.Msg.alert("信息", "登陆失败!!"); } }); } } Ext.onReady(LoginDemo); </script> </div> </form> </body> </html>
新建WebForm1.aspx页面:
using System; using System.Collections; using System.Configuration; using System.Data; using System.Linq; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.HtmlControls; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Xml.Linq; using System.Data.SqlClient; namespace WebApplication1 { public partial class WebForm1 : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { string ParamValue = Request.QueryString["ParamValue"]; if (ParamValue == "1") { string UserName = Request.QueryString["ParamUserName"]; string Password = Request.QueryString["ParamPassword"]; SqlConnection conn = new SqlConnection(); conn.ConnectionString = "Data Source=.;Initial Catalog=TestDB;Integrated Security=True"; if (conn.State == ConnectionState.Closed) conn.Open(); SqlCommand cmd = new SqlCommand(); cmd.Connection = conn; cmd.CommandText = string.Format("select User_ID from Users where User_Name = '{0}' and User_Password = '{1}'", UserName, Password); object obj = cmd.ExecuteScalar(); if (obj != null) { if (Convert.ToString(obj) != "") { Response.Write("{success:true,msg:'登陆成功!'}"); } else { Response.Write("{success:false}"); } } else { Response.Write("{success:false}"); } if (conn.State == ConnectionState.Open) conn.Close(); Response.End(); } } } }
比较简单。。但啥说都是咱的第一次哈!!!继续努力中。。。。!!!!