天天看点

Ext添加案例

1.建立一个页面 AddStudent.aspx

 using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data.OracleClient;

public partial class AddStudent : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

InsertStudent();

}

public void InsertStudent()

{

string sql = "insert into stuInfo values('{0}','{1}','{2}')";

string stuId=Request.Form["txtStuId"];

string stuName=Request.Form["txtStuName"];

string tel=Request.Form["txtTel"];

string childSql =string.Format(sql,stuId,stuName,tel);

OracleConnection con = new OracleConnection("Data Source=Orcl;User ID=zj;password=zj;");

OracleCommand cmd = new OracleCommand(childSql,con);

con.Open();

if (cmd.ExecuteNonQuery() > 0)

{

Response.Write("{ok:'true'}");

}

else

{

Response.Write("{ok:'false'}");

}

con.Close();

}

}

2.建立一个测试页面:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="FormSubmit.aspx.cs" Inherits="FormSubmit" %>

<!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></title>

<link href="ext-all.css" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" mce_href="ext-all.css" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" rel="stylesheet" type="text/css" />

<mce:script src="ext-base.js" mce_src="ext-base.js" type="text/javascript"></mce:script>

<mce:script src="ext-all.js" mce_src="ext-all.js" type="text/javascript"></mce:script>

<mce:script type="text/javascript"><!--

Ext.onReady(function() {

var leftColumn = [{

xtype: "textfield",

fieldLabel: "学生编号",

id: "stuId",

name: "txtStuId",

blankText: "学生编号不能为空",

allowBlank: false,

archer: "60"

},

{

xtype: "textfield",

fieldLabel: "学生姓名",

id: "stuName",

name: "txtStuName",

allowBlank: false,

blankText: "学生姓名不能为空",

archer: "60"

},

{

xtype: "textfield",

fieldLabel: "联系电话",

id: "tel",

archer: "90",

blankText: "学生电话不能为空",

allowBlank: false,

name: "txtTel",

maxLength: 12

}

];

var myForm = new Ext.FormPanel({

width: 500,

height: 500,

plain: true,

layout: "form",

//defaultType: "textfield",

labelWidth: 75,

labelSeparator: ":",

baseCls: "x-plain",

//锚点布局-

defaults: { anchor: "95%", msgTarget: "side" },

buttonAlign: "center",

bodyStyle: "padding:0 0 0 0",

items: leftColumn

});

var myWindow = new Ext.Window({

title: "增加学生信息",

width: 410,

height: 285,

plain: true,

//layout:"form",

iconCls: "openroomicon",

//不可以随意改变大小

resizable: false,

//是否可以拖动

//draggable:false,

defaultType: "textfield",

labelWidth: 100,

collapsible: true, //允许缩放条

closeAction: 'hide',

closable: true,

//弹出模态窗体

modal: 'true',

buttonAlign: "center",

bodyStyle: "padding:10px 0 0 15px",

items: [myForm],

listeners: {

"show": function() {

//当window show事件发生时清空一下表单

// myForm.getForm().rest();

}

}

, buttons: [

{

text: "确定:",

width: 70,

handler: function() {

if (myForm.getForm().isValid()) {

Ext.MessageBox.show({

msg: "正在保存,请稍后...",

progressText: "Saving...",

width: 300,

wait: true,

waitConfig: { interval: 3000 },

icon: "download"

});

setTimeout(function() { }, 3000),

myForm.getForm().submit({

url: "addStudent.aspx",

method: "post",

success: function(form, action) {

var flag = action.result.ok;

if (flag == "true") {

Ext.Msg.alert("提示", "恭喜,添加信息成功!");

myWindow.hide();

}

},

failure: function(form, action) {

Ext.Msg.alert("提示", "添加信息失败!");

}

});

}

}

},

{

text: "取消",

width: 70,

handler: function() {

myForm.getForm().reset();

myWindow.hide();

}

}

]

});

Ext.get("btnAdd").on("click", function() {

myWindow.show();

});

});

// --></mce:script>

</head>

<body>

<form id="form1" runat="server">

<div>

<input type="button" id="btnAdd" value="添加新同学" />

</div>

</form>

</body>

</html>

OK.