Ext.Net一些特别问题（有些未验证）
一：怎么动态增加TreePanel的子级 和怎么获得TreePanle树的值
前台：
（1）
var store = App.TreePanel1.getStore(), node = store.getNodeById("Node1"); node.appendChild({ text : "The New Node", leaf : true })（2）
var sm = App.TreePanel1.getSelectionModel(); selectedNode, parentNode; if (sm.hasSelection()) { selectedNode = sm.getSelection()[0], parentNode = selectedNode.parentNode; }后台
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %> <script runat="server"> protected void GetSelectedNode(object sender, DirectEventArgs e) { TreeSelectionModel sm = this.TreePanel1.GetSelectionModel() as TreeSelectionModel; string msg = "no selection"; if (sm.SelectedNodes != null) { SubmittedNode node = sm.SelectedNodes[0]; msg = node.Text; } X.Msg.Alert("GetSelectedNode", msg).Show(); } protected void AddNode(object sender, DirectEventArgs e) { Node node = new Node() { Text = "NEW NODE", Leaf = true }; this.TreePanel1.GetNodeById("Root").AppendChild(node); } </script> <!DOCTYPE html> <html> <head runat="server"> <title>Ext.NET v2 Example</title> </head> <body> <form runat="server"> <ext:ResourceManager runat="server" /> <ext:TreePanel ID="TreePanel1" runat="server" AutoHeight="true"> <Root> <ext:Node NodeID="Root" Text="Root (level 0)" Expanded="true"> <Children> <ext:Node Text="Node1 (level 1)" Expanded="true"> <Children> <ext:Node Text="Node1 (level 2)" Expanded="true"> <Children> <ext:Node Text="Node1 (level 3)" Leaf="true" /> <ext:Node Text="Node2 (level 3)" Leaf="true" /> </Children> </ext:Node> </Children> </ext:Node> <ext:Node Text="Node2 (level 1)" Expanded="true"> <Children> <ext:Node Text="Node1 (level 2)" Expanded="true"> <Children> <ext:Node Text="Node1 (level 3)" Leaf="true" /> <ext:Node Text="Node2 (level 3)" Leaf="true" /> </Children> </ext:Node> </Children> </ext:Node> </Children> </ext:Node> </Root> <SelectionModel> <ext:TreeSelectionModel runat="server" /> </SelectionModel> </ext:TreePanel> <ext:Button runat="server" Text="Get Selected Node" OnDirectClick="GetSelectedNode" /> <ext:Button runat="server" Text="Add node" OnDirectClick="AddNode" /> </form> </body> </html>二：动态创建TreePanel 并创建其上面创建button事件(不能有
if (!X.IsAjaxRequest))<%@ Page Language="C#" %> <script runat="server"> protected void Page_Load(object sender, EventArgs e) { var tree = new TreePanel { ID = "TreePanel1", Title = "Test", ButtonAlign = Alignment.Left }; var root = new Ext.Net.TreeNode() { AllowDrag = false, Text = "Form Name", Expanded = true }; tree.Root.Add(root); var saveButton = new Ext.Net.Button { ID = "saveDef", Icon = Icon.Disk, Text = "Save Changes", }; saveButton.Listeners.Click.Handler = "#{TreePanel1}.submitNodes();"; tree.Buttons.Add(saveButton); Panel1.Items.Add(tree); } protected void SubmitNodes(object sender, SubmitEventArgs e) { X.Msg.Alert("Submit", "You have submitted " + e.RootNode.Children.Count + " nodes").Show(); } </script> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" <head runat="server"> <title>Ext.Net Example</title> </head> <body> <form runat="server"> <ext:ResourceManager runat="server" /> <ext:Panel ID="Panel1" runat="server" /> </form> </body> </html><%@ Page Language="C#" %> <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <head runat="server"> <title>Ext.NET Example</title> <script type="text/javascript"> </script> </head> <body> <form runat="server"> <ext:ResourceManager runat="server" /> <ext:TreePanel ID="TreePanel1" runat="server" Height="300"> <Root> <ext:TreeNode Text="Composers" Expanded="true" Checked="False"> <Nodes> <ext:TreeNode Text="Beethoven" Expanded="true" Checked="False"> <Nodes> <ext:TreeNode Text="Concertos" Expanded="true" Checked="False"> <Nodes> <ext:TreeNode Text="Concert 1" Checked="False" /> <ext:TreeNode Text="Concert 2" Checked="False" /> </Nodes> </ext:TreeNode> </Nodes> </ext:TreeNode> </Nodes> </ext:TreeNode> </Root> <Buttons> <ext:Button runat="server" Text="Check all"> <Listeners> <Click Handler="#{TreePanel1}.getRootNode().cascade(function(n){n.ui.toggleCheck(true);});" /> </Listeners> </ext:Button> <ext:Button runat="server" Text="Uncheck all"> <Listeners> <Click Handler="#{TreePanel1}.getRootNode().cascade(function(n){n.ui.toggleCheck(false);});" /> </Listeners> </ext:Button> </Buttons> </ext:TreePanel> </form> </body> </html>四:TreePanel树后台创建事件并运行前端的JS
<%@ Page Language="C#" %> <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %> <script runat="server"> protected void TestDirectEventHandler(object sender, DirectEventArgs e) { Ext.Net.TreeNodeCollection nodes = new Ext.Net.TreeNodeCollection(); Ext.Net.TreeNode node = new Ext.Net.TreeNode("p1", "picture Name", Icon.PictureLink); node.Leaf = true; nodes.Add(node); X.Js.AddScript("#{TreePanel1}.getSelectionModel().getSelectedNode().loadNodes(eval(" + nodes.ToJson() + "));"); } </script> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" <head runat="server"> <title>Ext.Net Example</title> </head> <body> <form runat="server"> <ext:ResourceManager runat="server" /> <ext:TreePanelID="TreePanel1"runat="server"AutoHeight="true"RootVisible="false"> <Root> <ext:TreeNode Text="Root" Expanded="true"> <Nodes> <ext:AsyncTreeNode Text="Node1" /> <ext:AsyncTreeNode Text="Node2" /> </Nodes> </ext:TreeNode> </Root> </ext:TreePanel> <ext:Button runat="server" Text="Test" OnDirectClick="TestDirectEventHandler" /> </form> </body> </html>五：后台运行前台代码提示加载
X.Js.AddScript("Ext.net.Mask.show('Executing...'); ");
X.Js.AddScript("Ext.net.Mask.hide();");
X.Js.AddScript("Ext.net.Mask.hide();");
六：后台运行前台JS代码
.cs
X.Call("clearFields");.js
var clearFields = function () { Ext.Msg.notify("Info.", "I'm here..."); }七：JS调用后台的方式
第一种方法：也是大多人用的方法：
1.资源管理器中起来别名：DirectMethodNamespace="X"
<ext:ResourceManager ID="ResourceManager1" runat="server" DirectMethodNamespace="X"/>
2.在js方法中这样调用
X.方法名();
第二种方法：我个人推荐的
在js中直接调用后台方法不需要走别名
App.direct.方法名();
千万要记住在后台方法一定要标记为： [DirectMethod]
八：Ext.Net弹出窗口回写父窗口
用parent.App.就可以找到某个控件进行操作。
parent.App.sss.setValue(t);
parent.App.winSetting.hide();
九：Ext.Net:Panel增加背景图
<ext:Panel runat="server" ID="Panel1" BodyStyle="background:url(/Resources/images/Desktop/1.jpg) left bottom repeat-x;">
<Items>
</Items>
</ext:Panel>
十：动态增加CheckboxGroup选项
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %> <script runat="server"> protected void AddCheckboxClick(object sender, DirectEventArgs e) { ((Ext.Net.Button)sender).Disabled = true; CheckboxGroup1.Items.Add(new Checkbox { BoxLabel = "Checkbox 4", Checked = true }); CheckboxGroup1.Render(CheckboxGroup1.ContainerID, RenderMode.RenderTo); } protected void AddAnotherCheckboxClick(object sender, DirectEventArgs e) { ((Ext.Net.Button)sender).Disabled = true; // we have to recreate any previous dynamic added checkboxes CheckboxGroup1.Items.Add(new Checkbox { BoxLabel = "Checkbox 4", Checked = true }); CheckboxGroup1.Items.Add(new Checkbox { BoxLabel = "Checkbox 5", Checked = true }); CheckboxGroup1.Render(CheckboxGroup1.ContainerID, RenderMode.RenderTo); } </script> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" <head runat="server"> <title>Ext.NET Example</title> </head> <body> <form runat="server"> <ext:ResourceManager runat="server" /> <ext:CheckboxGroupID="CheckboxGroup1"runat="server"ColumnsNumber="1"> <Items> <ext:Checkbox runat="server" BoxLabel="Checkbox 1" /> <ext:Checkbox runat="server" BoxLabel="Checkbox 2" /> <ext:Checkbox runat="server" BoxLabel="Checkbox 3" /> </Items> </ext:CheckboxGroup> <ext:Buttonrunat="server"Text="Add checkbox"OnDirectClick="AddCheckboxClick" /> <ext:Buttonrunat="server"Text="Add another checkbox"OnDirectClick="AddAnotherCheckboxClick" /> </form> </body> </html>十一：后台创建Window以及设定其属性
protected void Page_Load(object sender, EventArgs e)public static Window CreateWindow(string wId, string wTitle, string wUrl)
{
CreateControl.CreateWindow("winCharacter", "角色选择", "../CommonWindow/CharacterSelection.aspx").Render(this.Form);
}
{
var win = new Window
{
ID = wId,
Title = wTitle,
Width = 530,
Height = 410,
Hidden = true,
X = 50,
Y = 130
};
win.AutoLoad.Url = wUrl;
win.AutoLoad.Mode = LoadMode.IFrame;
return win;
}
十二：子窗口给父窗口控件赋值
子窗口给父窗口控件赋值：parent.父窗口控件ID.setValue(value)。
但是如果你的控件ID是通过后台代码组合而成，出来的控件ID可能就是一串字符串，此时要注意了：要使用parent.eval（）方法把相关字符串转换成Ext对象。例如
control=“txtUserName”；
parent.eval(control).setValue(value);
十三：CheckboxGroup 勾选、全选、反选和限制勾选
<script type="text/javascript" defer="defer">
ConstraintChkedNum = 3; // 自定义限制勾选的数量
chkedId = [];
var checkWeek = {
SelectedAll: function(chkGrp) {
var idx;
var cbAll = Ext.getCmp(chkGrp.items.items[chkGrp.items.length - 2].id);
for (idx = 0; idx < chkGrp.items.length - 1; idx++) {
var cb = Ext.getCmp(chkGrp.items.items[idx].id);
cb.setValue(cbAll.checked);
}
},
Unselected: function(chkGrp) {
var idx;
for (idx = 0; idx < chkGrp.items.length - 2; idx++) {
var cb = Ext.getCmp(chkGrp.items.items[idx].id);
cb.setValue(!cb.checked);
}
},
SelectedConstraint: function(chk) {
if (chkedId.length >= ConstraintChkedNum) {
if (chkedId.join(',').match(chk.id) && !chk.checked) {
chkedId.remove(chk.id)
}
else {
alert('最多勾选 ' + ConstraintChkedNum + ' 项.');
chk.suspendEvents();
chk.setValue(false);
chk.resumeEvents();
}
}
else {
if (chk.checked) chkedId.push(chk.id);
else chkedId.remove(chk.id);
}
}
}
</script>
HTML文档
<h1>
勾选全选反选</h1>
<ext:CheckboxGroup ID="Weeks" runat="server" Width="500" Height="50">
<Items>
<ext:Checkbox ID="Checkbox1" runat="server" Name="Checkbox1" BoxLabel="周一" />
<ext:Checkbox ID="Checkbox2" runat="server" Name="Checkbox1" BoxLabel="周二" />
<ext:Checkbox ID="Checkbox3" runat="server" Name="Checkbox1" BoxLabel="周三" />
<ext:Checkbox ID="Checkbox4" runat="server" Name="Checkbox1" BoxLabel="周四" />
<ext:Checkbox ID="Checkbox5" runat="server" Name="Checkbox1" BoxLabel="周五" />
<ext:Checkbox ID="Checkbox6" runat="server" Name="Checkbox1" BoxLabel="周六" />
<ext:Checkbox ID="Checkbox7" runat="server" Name="Checkbox1" BoxLabel="周日" />
<ext:Checkbox ID="Checkbox8" runat="server" Name="Checkbox1" BoxLabel="全选">
<Listeners>
<Check Handler="checkWeek.SelectedAll(#{Weeks})" />
</Listeners>
</ext:Checkbox>
<ext:Checkbox ID="Checkbox9" runat="server" Name="Checkbox1" BoxLabel="反选">
<Listeners>
<Check Handler="checkWeek.Unselected(#{Weeks})" />
</Listeners>
</ext:Checkbox>
</Items>
</ext:CheckboxGroup>
<h1>
限制勾选</h1>
<ext:CheckboxGroup ID="WeeksConstr" runat="server" Width="500" Height="200">
<Items>
<ext:Checkbox ID="Checkbox10" runat="server" Name="Checkbox1" BoxLabel="周一">
<Listeners>
<Check Fn="checkWeek.SelectedConstraint" />
</Listeners>
</ext:Checkbox>
<ext:Checkbox ID="Checkbox11" runat="server" Name="Checkbox1" BoxLabel="周二">
<Listeners>
<Check Fn="checkWeek.SelectedConstraint" />
</Listeners>
</ext:Checkbox>
<ext:Checkbox ID="Checkbox12" runat="server" Name="Checkbox1" BoxLabel="周三">
<Listeners>
<Check Fn="checkWeek.SelectedConstraint" />
</Listeners>
</ext:Checkbox>
<ext:Checkbox ID="Checkbox13" runat="server" Name="Checkbox1" BoxLabel="周四">
<Listeners>
<Check Fn="checkWeek.SelectedConstraint" />
</Listeners>
</ext:Checkbox>
<ext:Checkbox ID="Checkbox14" runat="server" Name="Checkbox1" BoxLabel="周五">
<Listeners>
<Check Fn="checkWeek.SelectedConstraint" />
</Listeners>
</ext:Checkbox>
<ext:Checkbox ID="Checkbox15" runat="server" Name="Checkbox1" BoxLabel="周六">
<Listeners>
<Check Fn="checkWeek.SelectedConstraint" />
</Listeners>
</ext:Checkbox>
<ext:Checkbox ID="Checkbox16" runat="server" Name="Checkbox1" BoxLabel="周日">
<Listeners>
<Check Fn="checkWeek.SelectedConstraint" />
</Listeners>
</ext:Checkbox>
</Items>
</ext:CheckboxGroup>
值得注意的是，chk.suspendEvents() 和 chk.resumeEvents() 是挂起和恢复 checkbox 控件的事件。
十四：ext.net GridPanel 加上悬浮提示
在ext.net中，常常遇到某一列不够宽，毕竟业务都是变的很快的，所以我们可以在悬浮某一列的时候给其加上tips，这样就算再多的内容也不怕了。
下面介绍2中加tips的方式：
1、只想给指定列加tips
a、c#代码
<ext:Column ColumnID="INTICKET_PTTI" DataIndex="INTICKET_PTTI" Header="检票口" Width="90" Align="Center" Wrap="true"> <Renderer Fn="RenderRow" /> </ext:Column>
b、js代码
function RenderRow(value, meta, rec, rowIndex, coIndex, ds) { if (value != null && value != "") { var tips = "<div ext:qtitle='' ext:qtip='" + value + "'>" + value + "</div>"; return tips; } };
2、给所有列加上tips
a、在GridPanel外面加上
<ext:ToolTip ID="RowTip" runat="server" Target="={GridPanel1.getView().mainBody}" Delegate=".x-grid3-cell" TrackMouse="true" AutoWidth="true" AutoHeight="true"> <Listeners> <Show Fn="showTip" /> </Listeners> </ext:ToolTip>
b、js代码
var showTip = function () { var rowIndex = GridPanel1.view.findRowIndex(this.triggerElement), cellIndex = GridPanel1.view.findCellIndex(this.triggerElement), record = Store1.getAt(rowIndex), fieldName = GridPanel1.getColumnModel().getDataIndex(cellIndex), data = record.get(fieldName); this.body.dom.innerHTML = data; };
如此这般那般就好了。
十五：ext.net 日期控件默认赋值
我们一般进入某个页面的时候，日期时间都已经赋好值了，这样能一目了然当前页面的数据是哪一个时间段内的。ext.net的DateField默认没有赋值的属性，只能通告其他的途径来赋值。
<ext:DateField runat="server" ID="dfProdDate" FieldLabel="生产日期" LabelWidth="80" Width="200"LabelAlign="Right" Format="Y-m-d H:i:s" EmptyText="请选择生产日期" AllowBlank="false"> |
Format是日期控件的值的格式
AllowBlank="false"代表这个控件不能为空，必须输入值
其他属性碰到一个讲一个
下面说如何给这个控件默认赋默认值
直接在body中添加以下代码即可：
<ext:ResourceManager ID="ScriptManager1" runat="server" Theme="Gray" /> <% dfProdDate.Value = string.Format("{0:yyyy-MM-dd HH:mm:ss}", DateTime.Now); %> |
十六：ext.net 控件后加文字
在ext.net中有控件前加文字采用 FieldLabel="***"，如何在后面加文字呢，直接的属性是没有的，只能通过写js。
<ext:TextField runat="server" ID="txCheckCrycle" FieldLabel="保修周期" Width="200" LabelWidth="80"Regex="^(0|([1-9]\d*))(\.\d+)?$" MaxLength="8"> <Listeners> <Render Fn="addText" /> </Listeners> </ext:TextField> |
Regex 是正则验证，我这里验证是否输入的是数字，
MaxLength最大长度只能是8位
Listeners 监听事件，主要是用来写js的。
我这里加了一个 <Render Fn="addText" />
var addText = function () { var _parentNode = Ext.getDom('txCheckCrycle').parentNode; Ext.get(_parentNode).createChild( { tag: 'span', html: ' 月'} ); } |
这样就在控件的后面加了一个“月”的文字。
十七：Panel展开刷新 关闭清除
<ext:Panel ID="pnlExamineList" runat="server" Collapsible="true" Header="true" Icon="UserFemale" Border="true" Title="审批历史" Height="200"> <AutoLoad Url="/FormServerTemplates/ExamineList.aspx" NoCache="true" Mode="IFrame" ShowMask="true" /> <Listeners> <Expand Handler="this.reload();" /> <Collapse Handler="this.clearContent();" /> </Listeners></ext:Panel>
十八：页面跳转提示
X.Redirect("/FormServerTemplates/DownLoad.aspx", "请稍候，下载马上就开始了...");
十九：其它几个注意的问题
1.如果对gridpanel要多获取选中记录的操作，操作在服务端，如果采用RowSelectionModel sm = skcs_Grid.SelectionModel.Primary as RowSelectionModel;
这种形式，请注意，将gridpanel的SelectionMemory设置为"Disabled"，否则将会重复提交记录，该开关可以在会回发后保持选中状态
2.Ext.net TreePanle 如何刷新呢？例如TreePlanle的ID为T1，不是T1.reload(),而是T1.root.reload();
3.ext:FileUploadField 浏览按钮不显示
这是bug，解决方案为：添加css
<style type="text/css"> .ext-ie .button-fix table.x-btn, .ext-gecko .button-fix table.x-btn{ top:0px; } .ext-ie .button-fix .x-form-text, .ext-gecko .button-fix .x-form-text{ margin-top:1px; }</style> |
<ext:FileUploadField ID="UpFile" runat="server" ButtonText="浏览" AllowBlank="false" EmptyText="请选择文件" Width="200" CtCls="button-fix" Icon="LinkAdd"/> |
4.清空GridPanel的checkbox选中行，GridPanel.getSelectionModel().clearSelections();可以清空选中状态
5.Ext.net1.1目前暂不支持MVC3.0的Razor引擎模式。
二十：RadioGroup当选择改变时响应事件
<%@ Page Language="C#" %><%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %><script runat="server"> protected void RadioGroup_Change(object sender, DirectEventArgs e) { RadioGroup rg = sender as RadioGroup; X.Msg.Alert("Change", rg.CheckedItems[0].ID).Show(); }</script><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" <head runat="server"> <title>Ext.NET Example</title></head><body> <form runat="server"> <ext:ResourceManager runat="server" /> <ext:RadioGroup runat="server" ColumnsNumber="1"> <Items> <ext:Radio ID="Radio1" runat="server" Checked="true" /> <ext:Radio ID="Radio2" runat="server" /> </Items> <DirectEvents> <Change OnEvent="RadioGroup_Change" /> </DirectEvents> </ext:RadioGroup> </form></body></html>
二十一：动态生成控件，无法取得控件的值：
1、动态生成控件，无法取得控件的值：
protected void Page_Init(object sender, EventArgs e) { ComboBox cmbTest = new ComboBox(); cmbTest.ID = "cmbTest"; InitBooleanDrop(cmbTest); cmbTest.DirectSelect += new ComponentDirectEvent.DirectEventHandler(cmbTest_DirectSelect); this.Page.Controls.Add(cmbTest); } private void InitBooleanDrop(ComboBox cmb) { ListItem item = new ListItem(); item.Text = "---请选择---"; item.Value = "0"; cmb.Items.Add(item); item = new ListItem(); item.Text = "Y"; item.Value = "1"; cmb.Items.Add(item); item = new ListItem(); item.Text = "N"; item.Value = "2"; cmb.Items.Add(item); cmb.SelectedItem.Text = cmb.Items[0].Text; } //不能取得选择的值 void cmbTest_DirectSelect(object sender, DirectEventArgs e) { ComboBox cmb = (ComboBox)sender; X.Msg.Alert(cmb.SelectedItem.Text, cmb.SelectedItem.Value).Show(); } |
测试了好久，其实问题就出在这句：
this.Page.Controls.Add(cmbTest);
将其改为以下这句就好了：
this.form1.Controls.Add(cmbTest);
二十二：JS获得GridPanel 选中的IDs值
<%@ Page Language="C#" %><%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %><script runat="server"> protected void Page_Load(object sender, EventArgs e) { if (!X.IsAjaxRequest) { Store store = this.GridPanel1.GetStore(); store.DataSource = new object[] { new object[] { "testId1", "test1", "test2" }, new object[] { "testId2", "test3", "test4" }, new object[] { "testId3", "test5", "test6" }, }; store.DataBind(); } } protected void ShowSelectedIds(object sender, DirectEventArgs e) { string[] s = JSON.Deserialize<string[]>(e.ExtraParams["selectedIds"]); X.Msg.Alert("Count", String.Format("Count: {0}; ids : {1}", s.Length, e.ExtraParams["selectedIds"])).Show(); }</script><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" <head runat="server"> <title>Ext.Net Example</title> <script type="text/javascript"> var getSelectedIds = function (grid) { var selectedIds = grid.selectedIds, arrayOfSelectedIds = []; for (var id in selectedIds) { arrayOfSelectedIds.push(id); } return arrayOfSelectedIds; }; </script></head><body> <form runat="server"> <ext:ResourceManager runat="server" /> <ext:GridPanel ID="GridPanel1" runat="server" AutoHeight="true"> <Store> <ext:Store runat="server"> <Reader> <ext:ArrayReader IDProperty="testId"> <Fields> <ext:RecordField Name="testId" /> <ext:RecordField Name="test1" /> <ext:RecordField Name="test2" /> </Fields> </ext:ArrayReader> </Reader> </ext:Store> </Store> <ColumnModel runat="server"> <Columns> <ext:Column Header="TestId" DataIndex="testId" /> <ext:Column Header="Test1" DataIndex="test1" /> <ext:Column Header="Test2" DataIndex="test2" /> </Columns> </ColumnModel> <SelectionModel> <ext:RowSelectionModel runat="server" /> </SelectionModel> <BottomBar> <ext:PagingToolbar runat="server" PageSize="1" /> </BottomBar> </ext:GridPanel> <ext:Button runat="server" Text="Show selected ids"> <DirectEvents> <Click OnEvent="ShowSelectedIds"> <ExtraParams> <ext:Parameter Name="selectedIds" Value="getSelectedIds(GridPanel1)" Mode="Raw" Encode="true" /> </ExtraParams> </Click> </DirectEvents> </ext:Button> </form></body></html>二十三 修改控件的样式
<%@ Page Language="C#" %><%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %><!DOCTYPE html><html><head runat="server"> <title>Ext.NET Examples</title> <style> .ux-btn button { font-size: 13px; font-weight: bold; height: 30px; width:90px; color: #003867; } </style></head><body> <form runat="server"> <ext:ResourceManager runat="server" Theme="Gray" /> <ext:Button runat="server" Text="MyButton" CtCls="ux-btn"></ext:Button> </form></body></html>二十四 后台新建控件跟事件 此代码为1。0版（修改一下新版也可以用）
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %><head id="Head1" runat="server"> <title>Test Page</title> <script runat="server"> private Coolite.Ext.Web.Label label1; private CheckboxGroup group; protected void Page_Init(object sender, EventArgs e) { group = new CheckboxGroup(); group.Width = Unit.Pixel(600); group.Height = Unit.Pixel(200); this.Form.Controls.Add(group); group.Items.Add(new Checkbox(true, "Item1")); group.Items.Add(new Checkbox(true, "Item2")); group.Items.Add(new Checkbox(false, "Item3")); group.Items.Add(new Checkbox(true, "Item4")); group.Items.Add(new Checkbox(false, "Item5")); Coolite.Ext.Web.Button b = new Coolite.Ext.Web.Button(); b.Text = "Submit"; b.AjaxEvents.Click.Event += Click_Event; this.Form.Controls.Add(b); label1 = new Coolite.Ext.Web.Label(); this.Form.Controls.Add(label1); } void Click_Event(object sender, AjaxEventArgs e) { StringBuilder sb = new StringBuilder(); foreach (Checkbox checkbox in group.Items) { sb.AppendFormat("<p>{0} - {1}</p>", checkbox.BoxLabel, checkbox.Checked); } label1.Html = sb.ToString(); } </script></head><body> <form id="form1" runat="server"> <ext:ScriptManager ID="SM1" runat="server" /> </form></body></html>
浙公网安备 33010602011771号