443 lines
17 KiB
HTML
443 lines
17 KiB
HTML
|
||
|
||
|
||
<!DOCTYPE html>
|
||
<html>
|
||
<head><title>
|
||
|
||
</title>
|
||
<meta name="powered-by" content="FineUI v4.0.2.2 - 基于 ExtJS 的开源 ASP.NET 控件库 - http://fineui.com/" />
|
||
<link href="/extjs/res/ext-theme-neptune/all.css" rel="stylesheet" type="text/css"/>
|
||
<link href="../res/css/main.css" rel="stylesheet" type="text/css" /></head>
|
||
<body>
|
||
<form name="form1" method="post" action="grid_editor_cell.aspx" id="form1">
|
||
<div>
|
||
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
|
||
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
|
||
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKLTk4ODkyNDAwMg9kFgICAw9kFgICAw9kFhYCBw9kFgICAQ8PFgIeBFRleHQFATFkZAIID2QWAgIBDw8WAh8ABQEyZGQCCQ9kFgICAQ8PFgIfAAUBM2RkAgoPZBYCAgEPDxYCHwAFATRkZAILD2QWAgIBDw8WAh8ABQE1ZGQCDA9kFgICAQ8PFgIfAAUBNmRkAg0PZBYCAgEPDxYCHwAFATdkZAIOD2QWAgIBDw8WAh8ABQE4ZGQCDw9kFgICAQ8PFgIfAAUBOWRkAhAPZBYCAgEPDxYCHwAFAjEwZGQCEQ9kFgICAQ8PFgIfAAUCMTFkZBgCBR5fX0NvbnRyb2xzUmVxdWlyZVBvc3RCYWNrS2V5X18WBwUFR3JpZDEFGUdyaWQxJGN0bDAxJHRieEVkaXRvck5hbWUFFUdyaWQxJGN0bDAyJGRkbEdlbmRlcgUhR3JpZDEkY3RsMDMkdGJ4RWRpdG9yRW50cmFuY2VZZWFyBRdHcmlkMSRjdGwwNCREYXRlUGlja2VyMQUaR3JpZDEkY3RsMDYkdGJ4RWRpdG9yTWFqb3IFB0J1dHRvbjIFBUdyaWQxDw9kZWT1DLeIeEL8EJwArgigWTzCOvubgg==" />
|
||
</div>
|
||
|
||
<script type="text/javascript">
|
||
//<![CDATA[
|
||
var theForm = document.forms['form1'];
|
||
if (!theForm) {
|
||
theForm = document.form1;
|
||
}
|
||
function __doPostBack(eventTarget, eventArgument) {
|
||
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
|
||
theForm.__EVENTTARGET.value = eventTarget;
|
||
theForm.__EVENTARGUMENT.value = eventArgument;
|
||
theForm.submit();
|
||
}
|
||
}
|
||
//]]>
|
||
</script>
|
||
|
||
|
||
<div>
|
||
|
||
<input type="hidden" name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" value="1645A729" />
|
||
</div>
|
||
<div id='loading-mask'></div><div id='loading'><div class='loading-indicator'><img align='absmiddle' src='/extjs/res/images/loading_32.gif'/></div></div>
|
||
<div id="Grid1_wrapper"><div id="Grid1_tpls" class="f-grid-tpls x-hide-display"><div class="f-grid-tpl" id="Grid1_ctl07">
|
||
<span id="Grid1_ctl07_Label1">1</span>
|
||
</div><div class="f-grid-tpl" id="Grid1_ctl08">
|
||
<span id="Grid1_ctl08_Label1">2</span>
|
||
</div><div class="f-grid-tpl" id="Grid1_ctl09">
|
||
<span id="Grid1_ctl09_Label1">3</span>
|
||
</div><div class="f-grid-tpl" id="Grid1_ctl10">
|
||
<span id="Grid1_ctl10_Label1">4</span>
|
||
</div><div class="f-grid-tpl" id="Grid1_ctl11">
|
||
<span id="Grid1_ctl11_Label1">5</span>
|
||
</div><div class="f-grid-tpl" id="Grid1_ctl12">
|
||
<span id="Grid1_ctl12_Label1">6</span>
|
||
</div><div class="f-grid-tpl" id="Grid1_ctl13">
|
||
<span id="Grid1_ctl13_Label1">7</span>
|
||
</div><div class="f-grid-tpl" id="Grid1_ctl14">
|
||
<span id="Grid1_ctl14_Label1">8</span>
|
||
</div><div class="f-grid-tpl" id="Grid1_ctl15">
|
||
<span id="Grid1_ctl15_Label1">9</span>
|
||
</div><div class="f-grid-tpl" id="Grid1_ctl16">
|
||
<span id="Grid1_ctl16_Label1">10</span>
|
||
</div><div class="f-grid-tpl" id="Grid1_ctl17">
|
||
<span id="Grid1_ctl17_Label1">11</span>
|
||
</div></div></div>
|
||
<br />
|
||
<div id="Button2_wrapper"></div>
|
||
<br />
|
||
<br />
|
||
<div id="labResult_wrapper"></div>
|
||
<br />
|
||
|
||
<script src="/extjs/ext-part1.js" type="text/javascript"></script>
|
||
<script src="/extjs/ext-part2.js" type="text/javascript"></script>
|
||
<script src="/extjs/ext-theme-neptune.js" type="text/javascript"></script>
|
||
<script src="/extjs/lang/zh_CN.js" type="text/javascript"></script>
|
||
|
||
<script type="text/javascript">
|
||
//<![CDATA[
|
||
Ext.onReady(function () {
|
||
F.util.init('side', 100, '：', '/extjs/res/s.gif', true, 'default', true, 'neptune');
|
||
var f1 = {
|
||
f_state: {},
|
||
id: "Grid1_ctl00",
|
||
text: " ",
|
||
sortable: false,
|
||
dataIndex: "Grid1_ctl00",
|
||
width: 60,
|
||
menuDisabled: false,
|
||
hideable: true
|
||
};
|
||
var f8 = Ext.create('Ext.form.field.Text', {
|
||
f_state: {},
|
||
id: "Grid1_ctl01_tbxEditorName",
|
||
anchor: "-5px",
|
||
name: "Grid1$ctl01$tbxEditorName",
|
||
allowBlank: false
|
||
});
|
||
var f2 = {
|
||
f_state: {},
|
||
id: "Name",
|
||
text: "姓名",
|
||
sortable: false,
|
||
dataIndex: "Name",
|
||
width: 100,
|
||
menuDisabled: false,
|
||
hideable: true,
|
||
editor: f8
|
||
};
|
||
var f9_state = {
|
||
"F_Items": [["1", "男", 1], ["0", "女", 1]],
|
||
"F_Items_GZ": "",
|
||
"SelectedValue": "1"
|
||
};
|
||
var f9 = Ext.create('Ext.form.field.ComboBox', {
|
||
f_state: f9_state,
|
||
id: "Grid1_ctl02_ddlGender",
|
||
anchor: "-5px",
|
||
name: "Grid1$ctl02$ddlGender",
|
||
allowBlank: false,
|
||
editable: false,
|
||
forceSelection: true,
|
||
hiddenName: "Grid1_ctl02_ddlGender_Value",
|
||
store: Ext.create('Ext.data.ArrayStore', {
|
||
fields: ['value', 'text', 'enabled', 'prefix'],
|
||
data: F.simulateTree.transform(f9_state.F_Items)
|
||
}),
|
||
value: f9_state.SelectedValue,
|
||
tpl: F.util.ddlTPL,
|
||
queryMode: "local",
|
||
triggerAction: "all",
|
||
listeners: {
|
||
beforeselect: function (cmp, record, index) {
|
||
if (!record.data.enabled) {
|
||
return false;
|
||
}
|
||
}
|
||
}
|
||
});
|
||
var f3 = {
|
||
f_state: {},
|
||
id: "Gender",
|
||
text: "性别",
|
||
sortable: false,
|
||
dataIndex: "Gender",
|
||
width: 100,
|
||
menuDisabled: false,
|
||
hideable: true,
|
||
renderer: renderGender,
|
||
editor: f9
|
||
};
|
||
var f10 = Ext.create('Ext.form.field.Number', {
|
||
f_state: {},
|
||
id: "Grid1_ctl03_tbxEditorEntranceYear",
|
||
anchor: "-5px",
|
||
name: "Grid1$ctl03$tbxEditorEntranceYear",
|
||
allowDecimals: false,
|
||
allowNegative: false,
|
||
maxValue: 2010,
|
||
minValue: 2000
|
||
});
|
||
var f4 = {
|
||
f_state: {},
|
||
id: "EntranceYear",
|
||
text: "入学年份",
|
||
sortable: false,
|
||
dataIndex: "EntranceYear",
|
||
width: 100,
|
||
menuDisabled: false,
|
||
hideable: true,
|
||
editor: f10
|
||
};
|
||
var f11 = Ext.create('Ext.form.field.Date', {
|
||
f_state: {},
|
||
id: "Grid1_ctl04_DatePicker1",
|
||
anchor: "-5px",
|
||
name: "Grid1$ctl04$DatePicker1",
|
||
allowBlank: false,
|
||
format: "Y-m-d",
|
||
altFormats: "Y-m-d|Y-n-j|Ymd|Ynj|y-m-d|y-n-j|ymd|ynj"
|
||
});
|
||
var f5 = {
|
||
f_state: {},
|
||
id: "EntranceDate",
|
||
text: "入学日期",
|
||
sortable: false,
|
||
dataIndex: "EntranceDate",
|
||
width: 120,
|
||
menuDisabled: false,
|
||
hideable: true,
|
||
renderer: F.format.date('Y-m-d'),
|
||
editor: f11
|
||
};
|
||
var f6 = {
|
||
f_state: {},
|
||
id: "AtSchool",
|
||
text: "是否在校",
|
||
sortable: false,
|
||
dataIndex: "AtSchool",
|
||
width: 100,
|
||
menuDisabled: false,
|
||
hideable: true,
|
||
xtype: "checkcolumn"
|
||
};
|
||
var f12 = Ext.create('Ext.form.field.Text', {
|
||
f_state: {},
|
||
id: "Grid1_ctl06_tbxEditorMajor",
|
||
anchor: "-5px",
|
||
name: "Grid1$ctl06$tbxEditorMajor",
|
||
allowBlank: false
|
||
});
|
||
var f7 = {
|
||
f_state: {},
|
||
id: "Major",
|
||
text: "所学专业",
|
||
sortable: false,
|
||
dataIndex: "Major",
|
||
width: 100,
|
||
flex: 1,
|
||
menuDisabled: false,
|
||
hideable: true,
|
||
editor: f12
|
||
};
|
||
var f0_state = {
|
||
"RecordCount": 11,
|
||
"F_Rows": {
|
||
"Values": [["#@TPL@#ctl07", "张萍萍", "0", "2000", "2000-09-01T00:00:00", "true", "材料科学与工程系"], ["#@TPL@#ctl08", "陈飞", "1", "2001", "2001-09-01T00:00:00", "false", "化学系"], ["#@TPL@#ctl09", "董婷婷", "0", "2008", "2008-09-01T00:00:00", "true", "化学系"], ["#@TPL@#ctl10", "刘国", "1", "2002", "2002-09-01T00:00:00", "false", "化学系"], ["#@TPL@#ctl11", "康颖颖", "0", "2008", "2008-09-01T00:00:00", "true", "数学系"], ["#@TPL@#ctl12", "彭博", "1", "2003", "2003-09-01T00:00:00", "false", "数学系"], ["#@TPL@#ctl13", "黄倩倩", "0", "2000", "2000-09-01T00:00:00", "true", "数学系"], ["#@TPL@#ctl14", "唐超", "1", "2004", "2004-09-01T00:00:00", "false", "物理系"], ["#@TPL@#ctl15", "杨娟娟", "0", "2003", "2003-09-01T00:00:00", "true", "物理系"], ["#@TPL@#ctl16", "徐鹏", "1", "2002", "2002-09-01T00:00:00", "false", "物理系"], ["#@TPL@#ctl17", "纪玲玲", "0", "2006", "2006-09-01T00:00:00", "true", "自动化系"]],
|
||
"DataKeys": [[101, "张萍萍"], [102, "陈飞"], [103, "董婷婷"], [104, "刘国"], [105, "康颖颖"], [106, "彭博"], [107, "黄倩倩"], [108, "唐超"], [109, "杨娟娟"], [110, "徐鹏"], [111, "纪玲玲"]],
|
||
"States": [[], [], [], [], [], [], [], [], [], [], []]
|
||
},
|
||
"F_Rows_GZ": ""
|
||
};
|
||
var f0_selModel = Ext.create('Ext.selection.CellModel', {});
|
||
var f0_store = Ext.create('Ext.data.ArrayStore', {
|
||
fields: [{
|
||
name: "Grid1_ctl00"
|
||
},
|
||
{
|
||
name: "Name",
|
||
type: "string"
|
||
},
|
||
{
|
||
name: "Gender",
|
||
type: "int"
|
||
},
|
||
{
|
||
name: "EntranceYear",
|
||
type: "int"
|
||
},
|
||
{
|
||
name: "EntranceDate",
|
||
type: "date"
|
||
},
|
||
{
|
||
name: "AtSchool",
|
||
type: "boolean"
|
||
},
|
||
{
|
||
name: "Major",
|
||
type: "string"
|
||
}],
|
||
remoteSort: true,
|
||
listeners: {
|
||
beforeload: function (store, operation) {
|
||
var sorter = operation.sorters[0];
|
||
if (sorter) {
|
||
__doPostBack('Grid1', 'Sort$' + sorter.property + '$' + sorter.direction);
|
||
}
|
||
return false;
|
||
}
|
||
}
|
||
});
|
||
var f0_columns = [f1, f2, f3, f4, f5, f6, f7];
|
||
var Grid1_celledit = Ext.create('Ext.grid.plugin.CellEditing', {
|
||
pluginId: "Grid1_celledit",
|
||
clicksToEdit: 1
|
||
});
|
||
var f0 = Ext.create('Ext.grid.Panel', {
|
||
f_state: f0_state,
|
||
id: "Grid1",
|
||
renderTo: "Grid1_wrapper",
|
||
width: 850,
|
||
height: 350,
|
||
frame: true,
|
||
bodyStyle: "",
|
||
border: true,
|
||
animCollapse: true,
|
||
collapsible: true,
|
||
collapsed: false,
|
||
title: "表格",
|
||
selModel: f0_selModel,
|
||
columns: f0_columns,
|
||
store: f0_store,
|
||
draggable: false,
|
||
enableColumnMove: false,
|
||
enableDragDrop: false,
|
||
plugins: [Grid1_celledit],
|
||
listeners: {
|
||
viewready: function (cmp) { },
|
||
render: function (cmp) {
|
||
cmp.f_loadData();
|
||
}
|
||
}
|
||
});
|
||
var f13 = Ext.create('Ext.button.Button', {
|
||
f_state: {},
|
||
id: "Button2",
|
||
renderTo: "Button2_wrapper",
|
||
text: "保存数据",
|
||
handler: function () {
|
||
F.disable('Button2');
|
||
__doPostBack('Button2', '');
|
||
}
|
||
});
|
||
var f14 = Ext.create('Ext.form.field.Display', {
|
||
f_state: {},
|
||
id: "labResult",
|
||
renderTo: "labResult_wrapper",
|
||
anchor: "-5px",
|
||
name: "labResult",
|
||
value: ""
|
||
});
|
||
F.util.removePageLoading(false);
|
||
F.util.triggerReady();
|
||
|
||
Ext.create('Ext.data.Store', {
|
||
storeId: 'simpsonsStore',
|
||
fields: ['name', 'email', 'phone', 'id'],
|
||
data: {
|
||
'items': [
|
||
{ "name": "Lisa", "email": "lisa@simpsons.com", "phone": "555-111-1224", "id": "0" },
|
||
{ "name": "Bart", "email": "bart@simpsons.com", "phone": "555-222-1234", "id": "1" },
|
||
{ "name": "Homer", "email": "home@simpsons.com", "phone": "555-222-1244", "id": "2" },
|
||
{ "name": "Marge", "email": "marge@simpsons.com", "phone": "555-222-1254", "id": "3" }
|
||
]
|
||
},
|
||
proxy: {
|
||
type: 'memory',
|
||
reader: {
|
||
type: 'json',
|
||
root: 'items'
|
||
}
|
||
}
|
||
});
|
||
|
||
// the renderer. You should define it within a namespace
|
||
var comboBoxRenderer = function (combo) {
|
||
return function (value) {
|
||
var idx = combo.store.find(combo.valueField, value);
|
||
var rec = combo.store.getAt(idx);
|
||
return (rec === null ? '' : rec.get(combo.displayField));
|
||
};
|
||
}
|
||
// the combo store
|
||
var store = new Ext.data.ArrayStore({
|
||
// fields: ["value", "text"],
|
||
// data: [ ["1", "Option 1"],["2", "Option 2"]]
|
||
fields: ['value', 'text', 'enabled', 'prefix'],
|
||
data: [["1", "男", 1], ["0", "女", 1]] //F.simulateTree.transform(f9_state.F_Items)
|
||
});
|
||
// the edit combo
|
||
|
||
var combo = new Ext.form.ComboBox({
|
||
store: store,
|
||
valueField: "value",
|
||
displayField: "text"
|
||
});
|
||
|
||
/*
|
||
var combo = Ext.create('Ext.form.field.ComboBox', {
|
||
f_state: f9_state,
|
||
// id: "Grid1_ctl02_ddlGender",
|
||
// anchor: "-5px",
|
||
// name: "Grid1$ctl02$ddlGender",
|
||
// allowBlank: false,
|
||
// editable: false,
|
||
// forceSelection: true,
|
||
// hiddenName: "Grid1_ctl02_ddlGender_Value",
|
||
store: Ext.create('Ext.data.ArrayStore', {
|
||
fields: ['value', 'text', 'enabled', 'prefix'],
|
||
data: F.simulateTree.transform(f9_state.F_Items)
|
||
}),
|
||
// value: f9_state.SelectedValue,
|
||
// tpl: F.util.ddlTPL,
|
||
// queryMode: "local",
|
||
// triggerAction: "all",
|
||
listeners: {
|
||
beforeselect: function (cmp, record, index) {
|
||
if (!record.data.enabled) {
|
||
return false;
|
||
}
|
||
}
|
||
}
|
||
});
|
||
*/
|
||
|
||
|
||
// demogrid
|
||
Ext.create('Ext.grid.Panel', {
|
||
title: 'Simpsons',
|
||
store: Ext.data.StoreManager.lookup('simpsonsStore'),
|
||
columns: [
|
||
{ header: 'Name', dataIndex: 'name', editor: 'textfield' },
|
||
{
|
||
header: 'Email', dataIndex: 'email', flex: 1,
|
||
editor: {
|
||
xtype: 'textfield',
|
||
allowBlank: false
|
||
}
|
||
},
|
||
{ header: 'Phone', dataIndex: 'phone' },
|
||
{ header: 'id', dataIndex: 'id', editor: combo, renderer: comboBoxRenderer(combo) }
|
||
],
|
||
selType: 'cellmodel',
|
||
plugins: [
|
||
Ext.create('Ext.grid.plugin.CellEditing', {
|
||
clicksToEdit: 1
|
||
})
|
||
],
|
||
height: 200,
|
||
width: 400,
|
||
renderTo: Ext.getBody()
|
||
});
|
||
|
||
|
||
});//]]>
|
||
</script>
|
||
</form>
|
||
<script>
|
||
|
||
function renderGender(value) {
|
||
return value == 1 ? '男' : '女';
|
||
}
|
||
|
||
|
||
function renderAtSchool(value, metadata, record, rowIndex, colIndex) {
|
||
return value ? '<img src="../extjs/res/images/tick.png" alt="YES"/>' : '<img src="../extjs/res/images/bullet_cross.png" alt="NO"/>';
|
||
}
|
||
|
||
|
||
</script>
|
||
</body>
|
||
</html>
|