ExtJsログイン画面(修正中)

  
  
  
  

   
   
   
   
var loginPanel;  
   
   
   
   
 
   
   
   
   
Ext.QuickTips.init();  
   
   
   
   
 
   
   
   
   
Ext.onReady(function() {  
   
   
   
   
 
   
   
   
   
 
   
   
   
   
   var   bgObj=document.createElement("div");//    div  （   ）          
   
   
   
   
    //  div       
   
   
   
   
    bgObj.setAttribute("id","bgDiv");    
   
   
   
   
    bgObj.style.position="absolute";     
   
   
   
   
       
   
   
   
   
    bgObj.style.background="#777";     
   
   
   
   
    bgObj.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";     
   
   
   
   
    bgObj.style.opacity="0.6";    
   
   
   
   
       
   
   
   
   
    //bgObj.style.bottom = "75%";  
   
   
   
   
    bgObj.style.padding = "10px";  
   
   
   
   
    bgObj.style.width="100%";     
   
   
   
   
    bgObj.style.height="100%";     
   
   
   
   
    bgObj.style.zIndex   =  "10000";     
   
   
   
   
    document.body.appendChild(bgObj);// body    div      
   
   
   
   
       
   
   
   
   
      
   
   
   
   
    var   bottomer=document.createElement("div");//    div  （   ）          
   
   
   
   
    //  div       
   
   
   
   
    bottomer.setAttribute("id","btDiv");    
   
   
   
   
    bottomer.style.position="absolute";     
   
   
   
   
       
   
   
   
   
    bottomer.style.background="#777";     
   
   
   
   
    bottomer.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";     
   
   
   
   
    bottomer.style.opacity="0.6";    
   
   
   
   
       
   
   
   
   
    bottomer.style.top = "95%";  
   
   
   
   
    bottomer.style.padding = "10px";  
   
   
   
   
    bottomer.style.width="100%";     
   
   
   
   
    bottomer.style.height="100%";     
   
   
   
   
    bottomer.style.zIndex   =  "10000";     
   
   
   
   
    document.body.appendChild(bottomer);// body    div      
   
   
   
   
      
   
   
   
   
      
   
   
   
   
    var img = document.createElement("img");  
   
   
   
   
    img.setAttribute("src", "image/banner.jpg");  
   
   
   
   
 //   document.body.appendChild(img);  
   
   
   
   
 
   
   
   
   
 
   
   
   
   
    var loginFormPanel = new Ext.FormPanel(  
   
   
   
   
    {  
   
   
   
   
        id : 'login-form',  
   
   
   
   
        //                      labelWidth : 55,  
   
   
   
   
        frame : false,  
   
   
   
   
       // bodyStyle:"background-image:url(image/login.jpg)",  
   
   
   
   
        bodyStyle : 'background-image:url(image/login1.jpg) ; padding-top: 100px ; padding-right:5px; padding-left:50px;border: 0px solid;',  
   
   
   
   
          
   
   
   
   
        defaultType : 'textfield',  
   
   
   
   
        method : 'POST',  
   
   
   
   
        bodyBorder : true,  
   
   
   
   
        border : false,  
   
   
   
   
        align:'center',  
   
   
   
   
        plain:true,  
   
   
   
   
        width : 380,  
   
   
   
   
        height : 300,  
   
   
   
   
            buttonAlign : 'center',  
   
   
   
   
            labelAlign : 'right',  
   
   
   
   
        layout: "form",  
   
   
   
   
          
   
   
   
   
        items : [  
   
   
   
   
        {  
   
   
   
   
            id : 'j_username',  
   
   
   
   
            name : 'j_username',  
   
   
   
   
            x:493,  
   
   
   
   
            y:200,  
   
   
   
   
            width:150,  
   
   
   
   
            fieldLabel: '   ',   
   
   
   
   
            cls : 'png-user',  
   
   
   
   
                  inputTpye : 'username',  
   
   
   
   
            value :'admin',  
   
   
   
   
            allowBlank : false,  
   
   
   
   
            blankText : '      ' 
   
   
   
   
        },  
   
   
   
   
        {  
   
   
   
   
            id : 'j_password',  
   
   
   
   
            name : 'j_password',  
   
   
   
   
            x:493,  
   
   
   
   
            y:225,  
   
   
   
   
            width:150,  
   
   
   
   
            fieldLabel:"  ",  
   
   
   
   
            cls : 'png-password',  
   
   
   
   
            inputType : 'password',  
   
   
   
   
            value :'admin',  
   
   
   
   
            allowBlank : false,  
   
   
   
   
            blankText : '     ' 
   
   
   
   
        },  
   
   
   
   
        {  
   
   
   
   
            id : 'j_check',  
   
   
   
   
            name : 'j_check',  
   
   
   
   
            x:493,  
   
   
   
   
            y:250,  
   
   
   
   
            width:150,  
   
   
   
   
            fieldLabel: '   ',  
   
   
   
   
            allowBlank : true,  
   
   
   
   
            blankText : '      ' 
   
   
   
   
        },  
   
   
   
   
        {  
   
   
   
   
            id : 'j_image',  
   
   
   
   
            name : 'j_image',  
   
   
   
   
            x:493,  
   
   
   
   
            y:275,  
   
   
   
   
            width:60,  
   
   
   
   
            style : 'background:url(Random.jsp);background-repeat:no-repeat' 
   
   
   
   
        } ],  
   
   
   
   
        buttons : [  
   
   
   
   
        {  
   
   
   
   
            text : '  ',  
   
   
   
   
            iconCls : 'png-tick',  
   
   
   
   
            //iconAlign: 'right',  
   
   
   
   
            handler : function() {  
   
   
   
   
                if (loginFormPanel.form.isValid()) {  
   
   
   
   
                    loginFormPanel.form.submit( {  
   
   
   
   
                        url : 'servlet/LoginServlet',  
   
   
   
   
                        success : function(from, action) {  
   
   
   
   
                            var messager = Ext.decode(action.response.responseText);  
   
   
   
   
                            if (messager.success) {  
   
   
   
   
                                location.href = "Home/mmain.jsp";  
   
   
   
   
                            }  
   
   
   
   
                            else{  
   
   
   
   
                                Ext.Msg.alert('    ', message.msg);  
   
   
   
   
                            }  
   
   
   
   
                        },  
   
   
   
   
                        failure : function(form, action) {  
   
   
   
   
                            Ext.Msg.alert('    ', '    ！');  
   
   
   
   
                        },  
   
   
   
   
                        waitMsg : '    ，  ...' 
   
   
   
   
                    });  
   
   
   
   
                //               formWin.hide();  
   
   
   
   
                } else {  
   
   
   
   
                    Ext.Msg.alert('  ', '        !');  
   
   
   
   
                }  
   
   
   
   
            }  
   
   
   
   
        }, {  
   
   
   
   
        text : '  ',  
   
   
   
   
        iconCls : 'png-arrow_undo',  
   
   
   
   
        handler : function() {  
   
   
   
   
            loginFormPanel.form.reset();  
   
   
   
   
        }  
   
   
   
   
    } ]  
   
   
   
   
    
   
   
   
   
    renderTo : 'bgDiv',  
   
   
   
   
    });  
   
   
   
   
      
   
   
   
   
      
   
   
   
   
 
   
   
   
   
      
   
   
   
   
var loginPanel = new Ext.Panel(  
   
   
   
   
{  
   
   
   
   
              
   
   
   
   
      
   
   
   
   
    frame : false,  
   
   
   
   
 
   
   
   
   
      bodyStyle : 'background-image:url(image/back.jpg); padding-top: 169px; padding-left: 380px; border: 2px solid;',  
   
   
   
   
                          
   
   
   
   
          
   
   
   
   
    bodyBorder : true,  
   
   
   
   
    border : false,  
   
   
   
   
    align:"center",  
   
   
   
   
                          
   
   
   
   
    width:1600,  
   
   
   
   
    height:1200,  
   
   
   
   
    plain:true,  
   
   
   
   
       
   
   
   
   
    items :   
   
   
   
   
    [loginFormPanel]  
   
   
   
   
      
   
   
   
   
    });  
   
   
   
   
              
   
   
   
   
var loginport=new Ext.Viewport({  
   
   
   
   
    layout: {  
   
   
   
   
        type: 'hbox',  
   
   
   
   
        align: 'middle ',  
   
   
   
   
        pack: 'center' 
   
   
   
   
    },  
   
   
   
   
 
   
   
   
   
    border:true,  
   
   
   
   
    region:'center',  
   
   
   
   
    align:'center',  
   
   
   
   
    renderTo : Ext.getBody(),  
   
   
   
   
    items:loginPanel  
   
   
   
   
});      
   
   
   
   
      
   
   
   
   
});  
  
  
  
  

  
  
  
  

   
   
   
   
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 
   
   
   
   
<%@page import="cn.TLF.Coal.Dao.UsersDAO"%> 
   
   
   
   
<%@page import="cn.TLF.Coal.Util.JsonUtil"%> 
   
   
   
   
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
   
   
   
   
<html> 
   
   
   
   
    <head> 
   
   
   
   
 
   
   
   
   
        <title>    </title> 
   
   
   
   
 
   
   
   
   
      
   
   
   
   
        <link rel="stylesheet" type="text/css" 
   
   
   
   
            href="ext3/resources/css/ext-all.css" /> 
   
   
   
   
              
   
   
   
   
<style type=text/css>   
   
   
   
   
.png-tick{   
   
   
   
   
background:url(image/icon/accept.png);  
   
   
   
   
}   
   
   
   
   
</style>   
   
   
   
   
 
   
   
   
   
<style type=text/css>   
   
   
   
   
.png-arrow_undo{   
   
   
   
   
background:url(image/icon/cancel.png);  
   
   
   
   
}   
   
   
   
   
</style>   
   
   
   
   
 
   
   
   
   
<style type=text/css>   
   
   
   
   
.png-user{     
   
   
   
   
background-image:url(image/icon/user.png);     
   
   
   
   
background-position: 1px 1px;     
   
   
   
   
background-repeat:no-repeat;     
   
   
   
   
padding-left:20px;     
   
   
   
   
height:20px;     
   
   
   
   
FONT-SIZE: 12px;}    
   
   
   
   
</style>   
   
   
   
   
 
   
   
   
   
<style type=text/css>   
   
   
   
   
.png-password{     
   
   
   
   
background-image:url(image/icon/lock.png);     
   
   
   
   
background-position: 1px 1px;     
   
   
   
   
background-repeat:no-repeat;     
   
   
   
   
padding-left:20px;     
   
   
   
   
height:20px;     
   
   
   
   
FONT-SIZE: 12px;}    
   
   
   
   
</style>   
   
   
   
   
 
   
   
   
   
 
   
   
   
   
        <script type="text/javascript" src="ext3/adapter/ext/ext-base.js"> 
   
   
   
   
</script> 
   
   
   
   
        <script type="text/javascript" src="ext3/ext-all-debug.js"> 
   
   
   
   
</script> 
   
   
   
   
 
   
   
   
   
        <script type="text/javascript" src="login.js"> 
   
   
   
   
</script> 
   
   
   
   
 
   
   
   
   
    </head> 
   
   
   
   
 
   
   
   
   
    <body> 
   
   
   
   
    </body> 
   
   
   
   
</html>