Extjs4.2
用Extjs4.2写的一个增删改的页面
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="sys_language_manage.aspx.cs"
Inherits="SystemManager_sys_language_manage" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" >
<html>
<head runat="server" id="Head1">
<title></title>
</head>
<script src="../../js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
var editing = Ext.create('Ext.grid.plugin.CellEditing', { clicksToEdit: 1 });
var store = [];
var columns = [];
//保存
function saveData() {
if (document.getElementById("cc").value == document.getElementById("txt_xml").value) {
var gridItem = Ext.getCmp('grid').getStore().data.items;
var len = gridItem.length;
var m = Ext.getCmp('grid').getStore().getRange(0, store.getCount());
var jsonArray = [];
if (len > 0) {
Ext.each(m, function (item) {
jsonArray.push(item.data);
});
if (document.getElementById("bb").value.split("Xml")[1] == "/Reports/OrderPrintSetting.xml") {
document.getElementById("aa").value = "{Controls:[" + JSON.stringify(jsonArray) + "]}";
}
else {
document.getElementById("aa").value = "{LanguageConfig:[" + JSON.stringify(jsonArray) + "]}";
}
var n = 0;
for (var i = 0; i < len; i++) {
for (var j = 0; j < len; j++) {
if (i != j) {
if (gridItem[i].data.ID == gridItem[j].data.ID && gridItem[i].data.ID != "") {
n = 1;
editing.cancelEdit();
editing.startEditByPosition({ row: j, column: 1 });
//store.getAt(j).set('ID', '');//清空重复单元格
Ext.MessageBox.alert('<%= QpDesign.Share.Language.GetLanguageText("Tips", "提示")%>', '<%=QpDesign.Share.Language.GetLanguageText("ID", "ID不能重复，请重新输入!")%>');
return;
}
}
}
if (gridItem[i].data.ID == "") {
n = 1;
Ext.MessageBox.alert('<%= QpDesign.Share.Language.GetLanguageText("Tips", "提示")%>', '<%= QpDesign.Share.Language.GetLanguageText("0002", "请输入语言ID!")%>');
editing.cancelEdit();
editing.startEditByPosition({ row: i, column: 1 });
return;
}
}
}
if (n != 1) {
document.getElementById("cc").value = document.getElementById("txt_xml").value;
__doPostBack('btn_save', '');
}
}
else {
Ext.MessageBox.alert('<%= QpDesign.Share.Language.GetLanguageText("Tips", "提示")%>', '<%= QpDesign.Share.Language.GetLanguageText("Path", "路径错误!")%>');
}
}
$(function () {
//文本框设为只读
document.getElementById("txt_xml").readOnly = "readonly";
$('#btn_save').hide();
$('#txt_xml').hide();
})
//選擇語言XML文件
function img_choose_xml_onclick() {
oPopup.show("./sys_language_choose_xml.aspx", 600, 500);
}
//選擇了XML文件回發事件
function img_choose_xml_callback(path) {
document.getElementById("bb").value = "http://localhost/QpDesign/" + "Xml" + path.split("Xml")[1];
document.getElementById("txt_xml").value = path.replace(/(\/)+/g, "\\");
document.getElementById("oShipChargesNo-inputEl").value = path.replace(/(\/)+/g, "\\");
}
function onDelete(grid, rowIndex, colIndex) {
Ext.MessageBox.confirm('<%= QpDesign.Share.Language.GetLanguageText("Tips", "提示")%>', '<%= QpDesign.Share.Language.GetLanguageText("Item", "你确定删除此项吗？")%>', function callBack(btn) {
if (btn == "yes") {
grid.getStore().removeAt(rowIndex);
}
else return;
});
}
Ext.onReady(function () {
judge();
//添加按钮
var bar = ['-', {
text: '<%= QpDesign.Share.Language.GetLanguageText("UltraWebGrid1_AddButtonCaption", "新增")%>',
handler: function () {
//获取当前行数d
var count = grid.getStore().getCount();
var p = {
ID: '',
x_1: '',
y_1: '',
x_2: '',
y_2: '',
width: '',
height: ''
};
//取消编辑
editing.cancelEdit();
//在最后一列插入新行
grid.store.insert(count, p);
//进入第最后一行，第column列编辑
editing.startEditByPosition({ row: count, column: 1 });
//store.insert(0, p); // Create a model instance
}
}];
//创建表格
var grid = new Ext.grid.GridPanel({
id: 'grid',
renderTo: 'grid', //渲染位置
width: '100%',
title: '<%= QpDesign.Share.Language.GetLanguageText("PageHeaderTitle", "网站多语言配置")%>',
//autoHeight: true,
height: 700,
store: store,
columns: columns, //显示列
stripeRows: true, //斑马线效果
frame: true,
columnLines: true,
selType: 'cellmodel',
bbar: bar,
plugins: [editing],
dockedItems: [{
xtype: 'toolbar',
dock: 'top',
padding: 5,
//控制组件在什么位置，随便定位
items: [{
title: '<%= QpDesign.Share.Language.GetLanguageText("Query", "查询条件")%>', xtype: 'fieldset', padding: '10 5', layout: 'anchor', defaultType: "combobox", defaults: { anchor: '100%' },
items: [{
xtype: 'container', layout: 'hbox', defaultType: "combobox", margin: '0 0 5 0',
items: [
{
fieldLabel: '<%= QpDesign.Share.Language.GetLanguageText("lab_xml", "语言配置文件")%>',
labelWidth: 100,
labelAlign: 'right',
width: 500,
id: 'oShipChargesNo',
name: 'oShipChargesNo',
xtype: 'textfield'
}
, {
xtype: 'image',
src: '../../images/system/find.gif',
width: 16,
margin: '0 0 0 5',
listeners: {
el: {
click: function () {
img_choose_xml_onclick()
}
}
}
}
,
{
text: '<%= QpDesign.Share.Language.GetLanguageText("btn_read", "查看配置")%>',
id: "btnRE",
xtype: 'button',
width: 67,
margin: '0 0 0 5'
},
{
text: '<%= QpDesign.Share.Language.GetLanguageText("btn_save", "保存")%>',
id: "save",
xtype: 'button',
width: 67,
margin: '0 0 0 5',
handler: saveData
}
],
}],
}],
dock: 'top',//位置
displayInfo: true
}]
});
document.getElementById("oShipChargesNo-inputEl").readOnly = "readonly";
document.getElementById("oShipChargesNo-inputEl").value = document.getElementById("txt_xml").value;
//加载数据
store.load();
//调用换源
Ext.get('btnRE').on('click', function () {
reconfigure(grid, bar);
});
});
//编辑columshe和store
function judge() {
if (document.getElementById("bb").value.split("Xml")[1] == "/Reports/OrderPrintSetting.xml") {
columns = [
{
text:'<%= QpDesign.Share.Language.GetLanguageText("delete", "删除")%>',
xtype: 'actioncolumn',
width: 50,
align: 'center',
dataIndex: 'Delete',
icon: '../js/extjs/4.2.0/resources/ext-theme-gray/images/tab/tab-default-close.gif',
handler: onDelete
},
{
text: "ID", dataIndex: 'ID', flex: 1, editor: {
allowBlank: true
}
},
{
text: "x_1", dataIndex: 'x_1', flex: 1, editor: {
allowBlank: true
}
},
{
text: "y_1", width: 180, dataIndex: 'y_1', flex: 1, editor: {
allowBlank: true
}
},
{
text: "x_2", dataIndex: 'x_2', flex: 1, editor: {
allowBlank: true
}
},
{
text: "y_2", width: 115, dataIndex: 'y_2', flex: 1, editor: {
allowBlank: true
}
},
{
text: "width", dataIndex: 'width', flex: 1, editor: {
allowBlank: true
}
},
{
text: "height", dataIndex: 'height', flex: 1, editor: {
allowBlank: true
}
}]
store = Ext.create('Ext.data.Store', {
// //是否在服务端排序 （true的话，在客户端就不能排序）
remoteSort: false,
remoteFilter: true,
proxy: {
type: 'ajax',
url: document.getElementById("bb").value,
//项目中的路径
reader: {
type: 'xml',
record: 'Controls',//根目录
totalProperty: 'total'
}
},
fields: [
{ name: 'ID' }, //mapping:0 这样的可以指定列显示的位置，0代表第1列，可以随意设置列显示的位置
{ name: 'x_1' },
{ name: 'y_1' },
{ name: 'x_2' },
{ name: 'y_2' },
{ name: 'width' },
{ name: 'height' },
],
autoLoad: true//即时加载数据
});
}
else if (document.getElementById("txt_xml").value == 0) {
columns = []
store = Ext.create('Ext.data.Store', {
remoteSort: false,
remoteFilter: true,
proxy: {
type: 'ajax',
url: document.getElementById("bb").value,
reader: {
type: 'xml',
record: 'LanguageConfig',//根目录
totalProperty: 'total'
}
},
fields: [
{ name: 'ID' }, //mapping:0 这样的可以指定列显示的位置，0代表第1列，可以随意设置列显示的位置
{ name: 'x_1' },
{ name: 'y_1' },
{ name: 'x_2' },
{ name: 'y_2' },
{ name: 'width' },
{ name: 'height' },
],
autoLoad: true//即时加载数据
});
}
else {
columns = [
{
text: '<%= QpDesign.Share.Language.GetLanguageText("delete", "删除")%>',
xtype: 'actioncolumn',
width: 50,
align: 'center',
dataIndex: 'Delete',
icon: '../js/extjs/4.2.0/resources/ext-theme-gray/images/tab/tab-default-close.gif',
handler: onDelete
},
{
text: "ID", dataIndex: 'ID', flex: 1, editor: {
allowBlank: true
}
},
{
text: "zh-cn", dataIndex: 'zh-cn', flex: 1, editor: {
allowBlank: true
}
},
{
text: "zh-tw", dataIndex: 'zh-tw', flex: 1, editor: {
allowBlank: true
}
},
{
text: "en-us", dataIndex: 'en-us', flex: 1, editor: {
allowBlank: true
}
}]
store = Ext.create('Ext.data.Store', {
// //是否在服务端排序 （true的话，在客户端就不能排序）
remoteSort: false,
remoteFilter: true,
proxy: {
type: 'ajax',
url: document.getElementById("bb").value,
//项目中的路径
reader: {
type: 'xml',
record: 'LanguageConfig',//根目录
totalProperty: 'total'
}
},
fields: [
{ name: 'ID' }, //mapping:0 这样的可以指定列显示的位置，0代表第1列，可以随意设置列显示的位置
{ name: 'zh-cn' },
{ name: 'zh-tw' },
{ name: 'en-us' }
],
autoLoad: true//即时加载数据
});
}
}
//换源
function reconfigure(grid, bar) {
if (document.getElementById("txt_xml").value == "") {
Ext.MessageBox.alert('<%= QpDesign.Share.Language.GetLanguageText("Tips", "提示")%>','<%= QpDesign.Share.Language.GetLanguageText("0001", "請先選擇XML文件!")%>');
}
else {
document.getElementById("cc").value = document.getElementById("txt_xml").value;
judge();
}
//换源
grid.reconfigure(store, columns);
}
</script>
<body scroll="no">
<form id="form1" runat="server">
<div id="grid"></div>
<asp:HiddenField ID="aa" runat="server" Value="" />
<asp:HiddenField ID="bb" runat="server" Value="" />
<asp:HiddenField ID="cc" runat="server" Value="" />
<asp:TextBox ID="txt_xml" runat="server" BorderStyle="Solid" BorderWidth="1px" Width="400px" Style="margin-bottom: 0px"></asp:TextBox>
<input id="btn_save" name="btn_save" type="button" style="width: 60px; hidden='hidden'"
runat="server" accesskey="S" onserverclick="btn_save_ServerClick"/>
</form>
</body>
</html>
using System;
using System.Data;
using System.Web.UI.WebControls;
using QpDesign.Share;
using System.Text.RegularExpressions;
using Org.BouncyCastle.Asn1.Ocsp;
using System.Web.Services;
using QpDesign.BLL;
using System.Collections.Generic;
using QpDesign.Model.Shipping;
using QpDesign.BLL.Shipping;
public partial class SystemManager_sys_language_manage : QpDesign.Language.SystemManagerBasePage
{
#region 頁面加載事件
protected bool allowView = false;
protected bool allowModify = false;
protected void Page_Load(object sender, EventArgs e)
{
QpDesign.Language.ResourceFile.LoadCssFile("SystemManager/js/extjs/4.2.0/resources/css/ext-all-neptune.css");
//加載js
QpDesign.Language.ResourceFile.LoadJavaScriptFile("SystemManager/js/extjs/4.2.0/ext-all.js", "SystemManager/js/extjs/4.2.0/locale/ext-lang-zh_CN.js");
if (!this.IsPostBack)
{
//查詢權限
if (!Privilege.CheckRolePrivil(this.currentUser.UserRole, "06030401"))
Response.Redirect(string.Format("{0}/SystemManager/sys_not_right.aspx", FilesPath.WebSite));
}
//Button2.Attributes.Add("OnClick", "return bt_save()");
this.btn_save.Attributes["onclick"] = "javascript:return saveData();";
}
#endregion
public static DataTable JsonToDataTable(string strJson)
{
//转换json格式
strJson = strJson.Replace(",\"", "*\"").Replace("\":", "\"#").ToString();
//取出表名
var rg = new Regex(@"(?<={)[^:]+(?=:\[)", RegexOptions.IgnoreCase);
string strName = rg.Match(strJson).Value;
DataTable tb = null;
//去除表名
strJson = strJson.Substring(strJson.IndexOf("[") + 1);
strJson = strJson.Substring(0, strJson.IndexOf("]"));
//获取数据
rg = new Regex(@"(?<={)[^}]+(?=})");
MatchCollection mc = rg.Matches(strJson);
for (int i = 0; i < mc.Count; i++)
{
string strRow = mc[i].Value;
string[] strRows = strRow.Split('*');
//创建表
if (tb == null)
{
tb = new DataTable();
tb.TableName = strName;
foreach (string str in strRows)
{
var dc = new DataColumn();
string[] strCell = str.Split('#');
if (strCell[0].Substring(0, 1) == "\"")
{
int a = strCell[0].Length;
dc.ColumnName = strCell[0].Substring(1, a - 2);
}
else
{
dc.ColumnName = strCell[0];
}
tb.Columns.Add(dc);
}
tb.AcceptChanges();
}
//增加内容
DataRow dr = tb.NewRow();
for (int r = 0; r < strRows.Length; r++)
{
dr[r] = strRows[r].Split('#')[1].Trim().Replace("，", ",").Replace("：", ":").Replace("\"", "");
}
tb.Rows.Add(dr);
tb.AcceptChanges();
}
return tb;
}
protected void btn_save_ServerClick(object sender, EventArgs e)
{
string Xml = this.aa.Value;
if (this.aa.Value != "")
{
DataTable db = JsonToDataTable(Xml);
DataSet ds = new DataSet();
ds.Tables.Add(db);
System.IO.FileInfo fi = new System.IO.FileInfo(this.txt_xml.Text);
if (fi.IsReadOnly)
fi.IsReadOnly = false;
ds.WriteXml(this.txt_xml.Text, XmlWriteMode.IgnoreSchema);
//Response.Write("<script type='text/javascript'>alert('保存成功');</script>");
}
else
{
Response.Write("<script type='text/javascript'>alert('保存失败');</script>");
}
}
}
