extjs form表單 及 後臺保存數據
form表單
function formEdit(sel, templateid) {//sel
Ext.BLANK_IMAGE_URL = '../../Content/js/ext2/resources/images/default/s.gif';
var ID = sel.id;
var edtform = new Ext.FormPanel({
layout: 'column',
items: [{
items: {
columnWidth: 15,
layout: 'form',
border: false,
items: [{ //隱藏域
xtype : 'hidden',
name: 'ID',
value :ID
},
{
xtype: 'hidden',
name: 'templateid',
value: templateid
},
new Ext.form.DateField({//日期域
fieldLabel: ' 評估日期',
name: 'EvaluateDate',
width: 200,
allowBlank:false,
blankText: '日期不能爲空!',
value: sel.data["EvaluateDate"].replace(/\//g, "-")
}),
{//下拉列表
fieldLabel: ' 評估結果',
name: 'EvaluateResult',
xtype: 'combo',
width: 200,
//本地數據源 local/remote
mode: 'local',
//設置爲選項的text的字段
displayField: "name",
//設置爲選項的value的字段
valueField: "Id",
//是否可以輸入,還是隻能選擇下拉框中的選項
editable: false,
typeAhead: true,
//必須選擇一項
forceSelection: true,
//輸入部分選項內容匹配的時候顯示所有的選項
triggerAction: 'all',
value: sel.data["EvaluateResult"],
//selectOnFocus:true,
//數據
store: new Ext.data.SimpleStore({
fields: ['Id', 'name'],
data: [[1, '好'], [2, '中'],[3,'差']]
})
},
{//文本區域
xtype: 'textarea',
fieldLabel: ' 評估內容',
width: 200,
name: 'EvaluateContent',
// allowBlank:false
value: sel.data["EvaluateContent"]//獲取選擇項的值
}
]
}
}]
});
//保存按鈕事件
function doSave() {
Ext.MessageBox.show({
msg: '正在保存數據, 請稍侯',
progressText: '正在保存中',
width: 300,
wait: true,
waitConfig: { interval: 200 },
icon: 'ext-mb-save',
nimEl: 'btnSave'
});
edtform.getForm().submit({
url: '/yl/DayCare/Evaluate.ashx',//調用後臺保存頁面
method: 'POST',
success: function (form, action) {
Ext.MessageBox.hide();
Ext.MessageBox.alert('提示', '數據保存成功!');
window.hide();
grid.store.reload();
// ds.load({params:{start:0, limit:25}});
},
failure: function (form, action) {
Ext.MessageBox.hide();
Ext.MessageBox.show({
title: '錯誤',
msg: '數據保存失敗!',
buttons: Ext.Msg.OK,
icon: Ext.MessageBox.ERROR
});
}
});
}
var window = new Ext.Window({
title: '服務評估',//表單標題
//layout : 'fit',//設置window裏面的佈局
width: 400,//寬度
height: 200,//高度
items: edtform,//調用加載的表單
//關閉時執行隱藏命令,如果是close就不能再show出來了
closeAction: 'hide',
//draggable : false, //不允許窗口拖放
// maximizable : true,//最大化
// minimizable : true,//最小話
constrain: true,//防止窗口超出瀏覽器
//constrainHeader : true,//只保證窗口頂部不超出瀏覽器
//resizble : true,//是否可以改變大小
//resizHandles : true,//設置窗口拖放的方式
//modal : true,//屏蔽其他組件,自動生成一個半透明的div
animateTarget: 'target',//彈出和縮回的效果
//plain : true,//對窗口進行美化,可以看到整體的邊框
buttonAlign: 'center',//按鈕的對齊方式
defaultButton: 0,//默認選擇哪個按鈕
buttons: [{
id: 'btnSave',
text: '保 存',
handler: doSave,
disabled: false
}, {
text: '取消',
handler: function () {
window.hide();
}
}]
});
window.show();
new Ext.Viewport({
items: [window]
});
}
前臺調用編輯
actions.push({text:'評估',iconCls: 'newbtn', handler:function(){
var sel=grid.getSelectionModel().getSelections()[0]; //選中記錄
if(sel)
formEdit(sel,'<%=templateid%>') //傳值並調用form表單
}
保存按鈕的後臺處理頁面
public class Evaluate : IHttpHandler
{
protected string strJson = string.Empty;
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
string ID = context.Request.Form["ID"];//獲取前臺的值
string EvaluateDate = context.Request.Form["EvaluateDate"];
string EvaluateResult = context.Request.Form["EvaluateResult"];
string EvaluateContent = context.Request.Form["EvaluateContent"];
string templateid = context.Request.Form["templateid"];
DateTime date1 = Convert.ToDateTime(EvaluateDate);
try
{
FormTemplate template1 = EntityManager.GetEntityInstance(typeof(FormTemplate), templateid) as FormTemplate;
if (template1 != null)
{
string tableSql = "select * from " + template1.FormTableName + " where ID=" + ID;//SQL語句
DataTable dt = FormDirector.GetTableBySQL(tableSql);
if (dt.Rows.Count > 0)
{
WebOA.CustomForm.Managers.FormDirector.updateTable(template1.FormTableName, "ID=" + ID + "", "EvaluateDate='" + date1 + "',EvaluateResult='" + EvaluateResult + "',EvaluateContent='" + EvaluateContent + "'");//執行SQL語句
strJson = @"{success: true}";//保存成功返回值
}
else {
strJson = @"{success: false}";//保存失敗返回值
}
}
}
catch (Exception ex)
{
string strMsg = ex.Message;
strJson = @"{success: false}";
}
context.Response.Write(strJson);
}
public bool IsReusable
{
get
{
return false;
}
}
}