首页 > 代码库 > 转: ASP.NET+ExtJs4.0+表单提交submit,上传图片到服务器

转: ASP.NET+ExtJs4.0+表单提交submit,上传图片到服务器

http://blog.csdn.net/lmaohuanl/article/details/6792057

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2.   
  3. <html xmlns="http://www.w3.org/1999/xhtml">  
  4. <head>  
  5.     <title></title>  
  6.     <!--ExtJs4.0官方下载ExtJs样式文件-->  
  7.     <link href=http://www.mamicode.com/"extjs/resources/css/ext-all.css" rel="stylesheet" type="text/css" />  
  8.     <!--ExtJs4.0官方下载ExtJs文件-->  
  9.     <script src=http://www.mamicode.com/"extjs/ext-all.js" type="text/javascript"></script>  
  10.     <script language="javascript" type="text/javascript">  
  11.         function login_click(b) {  
  12.             //1.拿到表单面板  
  13.             var loginFormPanel=Ext.getCmp("loginFormPanel");  
  14.             //2.通过面板对象拿到它里面的表单  
  15.             var form = loginFormPanel.getForm();  
  16.             //3.在提交前,判断表单输入是否有误  
  17.             if (!form.isValid()) {  
  18.                 return;  
  19.             }  
  20.             //4.调用提交的方法,提交该表单  
  21.             form.submit({  
  22.                 waitMsg:"正在向服务器提交数据",  
  23.                 url:"Extjs1.aspx",  
  24.                 success: function (f, a) {  
  25.                     Ext.MessageBox.alert("提示", "你的详细信息如下:<br/>用户名:" + a.result.name + "<br/>密 码:" + a.result.password + "<br/>你上传的图片数量为:"   
  26.   
  27. + a.result.filecount);  
  28.                 },  
  29.                 failure: function (f,a) {  
  30.                     Ext.MessageBox.alert("提示", a.result.msg);  
  31.                 }  
  32.             });  
  33.         }  
  34.         Ext.onReady(function () {  
  35.             var txtUserName = new Ext.form.field.Text({  
  36.                 fieldLabel: "用户名",  
  37.                 labelWidth: 50,  
  38.                 margin: "10 0 5 0",  
  39.                 allowBlank: false,  
  40.                 blankText: "用户名不能为空",  
  41.                 name: "txtUserName"  
  42.             });  
  43.             var txtUserPassword = new Ext.form.field.Text({  
  44.                 fieldLabel: "密 码",  
  45.                 labelWidth: 50,  
  46.                 margin: "5 0 5 0",  
  47.                 inputType: "password",  
  48.                 allowBlank: false,  
  49.                 blankText: "密码不能为空",  
  50.                 name: "txtUserPassword"  
  51.             });  
  52.             var file = new Ext.form.field.File({  
  53.                 fieldLabel:"请选择一张图片",  
  54.                 buttonText:"浏览",  
  55.                 regex:/^.+\.(jpg|png|gif)$/,  
  56.                 regexText:"你只能选择jpg,png,gif格式的图片"  
  57.             });  
  58.             var win = new Ext.window.Window({  
  59.                 title: "提交数据——登录",  
  60.                 height: 200,  
  61.                 width: 350,  
  62.                 layout: "fit",  
  63.                 items: [  
  64.                     { xtype: "form", frame: true, layout: { type: "vbox", align: "center" },
    1.                      items: [txtUserName, txtUserPassword, file], buttons: [{ text: "登录",   
    2.   
    3.                     handler: login_click}], id: "loginFormPanel" }  
    4.                 ]  
    5.             });  
    6.             win.show();  
    7.         });  
    8.     </script>  
    9. </head>  
    10. <body>  
    11.   
    12. </body>  
    13. </html> 

       

      1. using System;  
      2. using System.Collections.Generic;  
      3. using System.Linq;  
      4. using System.Web;  
      5. using System.Web.UI;  
      6. using System.Web.UI.WebControls;  
      7.   
      8. public partial class Extjs1 : System.Web.UI.Page  
      9. {  
      10.     protected void Page_Load(object sender, EventArgs e)  
      11.     {  
      12.         System.Threading.Thread.Sleep(3000);  
      13.         string name = Request.Form["txtUserName"];  
      14.         string password = Request.Form["txtUserPassword"];  
      15.           
      16.         //.............................  
      17.         int pointIndex=Request.Files[0].FileName.LastIndexOf(".");  
      18.         string lastName=Request.Files[0].FileName.Substring(pointIndex);  
      19.         string fileName = new Random().Next(10000).ToString();  
      20.         string path = Server.MapPath("") + "/" + fileName + lastName;  
      21.         Request.Files[0].SaveAs(path);  
      22.         Response.Write("{success:true,msg:‘成功‘,name:‘"+name+"‘,password:‘"+password+"‘,filecount:‘"+Request.Files.Count+"‘}");  
      23.         Response.End();  
      24.     }  

 

转: ASP.NET+ExtJs4.0+表单提交submit,上传图片到服务器