一个EXTJS与JSP连接把数据写入数据库的例子

萝卜耳朵

于 2015-05-27 16:01:51 发布

阅读量1.7k

点赞数

分类专栏： ExtJS 文章标签： treepanel

ExtJS 专栏收录该内容

33 篇文章 2 订阅

订阅专栏

下面的问题本来是我问别人的最后自己搞定了，改自一个与PHP的版本。

现在有一个EXTJS做的前台注册窗口，窗口中有用户和密码两栏，一个提交按钮。
-----现在，在用户和密码两栏中填入数据，之后点提交按钮，数据通过EXTJS 提交到JSP然后写入数据库。
要全部的代码：EXTJS（前台部分），JSP（后台部分)

[javascript]view plaincopy 
   
 <!-- 首先前台部分使用extjs写一个简单的注册窗口 文件名为 login.html -->  
 <!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>  
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
 <title>extDemo</title>  
 <link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" mce_href="ext/resources/css/ext-all.css" />   
 <mce:script type="text/javascript" src="ext/adapter/ext/ext-base.js" mce_src="ext/adapter/ext/ext-base.js"></mce:script>  
 <mce:script type="text/javascript" src="ext/ext-all.js" mce_src="ext/ext-all.js"></mce:script>  
 </head>  
 <body>  
 <mce:script type="text/javascript"><!--  
 Ext.onReady(function(){   
           //使用表单提示  
           Ext.QuickTips.init();  
           Ext.form.Field.prototype.msgTarget = 'side';  
                     
                   //定义表单  
           var simple = new Ext.FormPanel({  
                                 labelWidth: 75,                           
                                 baseCls: 'x-plain',  
                                 defaults: {width: 150},  
                                 defaultType: 'textfield',//默认字段类型  
                    
                                 //定义表单元素  
                                 items: [{  
                                                 fieldLabel: '帐户',  
                                                 name: 'name',//元素名称  
                                                 //anchor:'95%',//也可用此定义自适应宽度  
                                                 allowBlank:false,//不允许为空  
                                                 blankText:'帐户不能为空'//错误提示内容  
                                         },{  
                                             inputType:'password',  
                                                 fieldLabel: '密码',  
                                                 //anchor:'95%',  
                                                 name: 'pws',  
                                                 allowBlank:false,  
                                                 blankText:'密码不能为空'  
                                         }  
                                 ],  
   
                                 buttons: [{  
                                         text: '提交',  
                                         type: 'submit',  
                                         //定义表单提交事件  
                                         handler:function(){  
                         if(simple.form.isValid()){//验证合法后使用加载进度条  
                                     Ext.MessageBox.show({  
                                  title: '请稍等',  
                                  msg: '正在加载...',  
                                  progressText: '',  
                                  width:300,  
                                  progress:true,  
                                  closable:false,  
                                  animEl: 'loding'  
                                 });  
                                 //控制进度速度  
                               var f = function(v){  
                            return function(){  
                                var i = v/11;  
                                 Ext.MessageBox.updateProgress(i, '');  
                                   };  
                                 };  
   
                            for(var i = 1; i < 13; i++){  
                              setTimeout(f(i), i*150);  
                               }  
                                     
                                //提交到服务器操作  
                               simple.form.doAction('submit',{  
                               url:'check.jsp',//文件路径  
                               method:'post',//提交方法post或get  
                               params:'',  
                               //提交成功的回调函数  
                              success:function(form,action){  
                                if (action.result.msg=='ok') {  
                                //document.location='index.html';  
                                Ext.Msg.alert('提示窗口','提交已成功！');  
                              } else {  
                                 Ext.Msg.alert('登陆错误',action.result.msg);  
                                }  
                                },  
                             //提交失败的回调函数  
                              failure:function(){  
                               Ext.Msg.alert('错误','服务器出现错误请稍后再试！');  
                                  }  
                                });  
                               }                                                                                 
                                         }  
                                 },{  
                                         text: '取消',  
                                         handler:function(){simple.form.reset();}//重置表单  
                                 }]  
                         });      
                                //定义窗体  
                                    win = new Ext.Window({  
                                                 id:'win',  
                                                 title:'注册窗口',  
                                               layout:'fit',   //之前提到的布局方式fit，自适应布局                                      
                                                 width:300,  
                                                 height:150,  
                                                 plain:true,  
                         bodyStyle:'padding:5px;',  
                                                 maximizable:false,//禁止最大化  
                                                 closeAction:'close',  
                                                 closable:false,//禁止关闭  
                                                 collapsible:true,//可折叠  
                                                 plain: true,  
                                                 buttonAlign:'center',  
                                                 items:simple//将表单作为窗体元素嵌套布局  
                                         });  
                                         win.show();//显示窗体  
                                                                                   
                  });  
 // --></mce:script>  
 </body>  
 </html>  

[java]view plaincopy 
   
 <!-- 后台部分 这里数据库使用的是Access数据库    本文件名为 check.jsp-->  
 <%@ page language="java" contentType="text/html; charset=gb2312"  
     pageEncoding="gbk"%>  
 <%@ page import = "java.sql.*,java.util.*" %>  
 <%  
       request.setCharacterEncoding("gb2312");  
       String name=request.getParameter("name");  
       String pws=request.getParameter("pws");  
       if(name.equals(pws)){  
          out.print("{success:true,msg:/'ok/'}");  
       }else{  
          out.print("{success:true,msg:/'帐户或密码错误/'}");  
       }  
         
       try{  
       String message=pws;  
       String sourceURL="jdbc:odbc:driver={Microsoft Access Driver (*.mdb)};DBQ=D://accdb";       
 //DataBase是Access MDB文件的主文件名  
       try{     
           Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");     
           }catch(Exception e){     
            e.printStackTrace();     
        }    
       Connection conn=DriverManager.getConnection(sourceURL);  
 //把驱动放入连接  
       Statement stmt=conn.createStatement();  
 //创建一个 Statement 对象来将 SQL 语句发送到数据库。  
       stmt.executeUpdate("INSERT INTO student VALUES("+"'"+name+"'"+","+"'"+message+"'"+")");  
        
       stmt.close();  
       conn.close();  
     }  
     catch(SQLException sqle){  
             //System.err.println(sqle);  
     }  
         
 %>  

萝卜耳朵

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
一个EXTJS与JSP连接把数据写入数据库的例子

下面的问题本来是我问别人的最后自己搞定了，改自一个与PHP的版本。现在有一个EXTJS做的前台注册窗口，窗口中有用户和密码两栏，一个提交按钮。-----现在，在用户和密码两栏中填入数据，之后点提交按钮，数据通过EXTJS 提交到JSP然后写入数据库。要全部的代码：EXTJS（前台部分），JSP（后台部分) [javascript] view
复制链接

扫一扫