TreePanel实现可以有多种,目前用到的有两种实现方式:数据源可以一次性加载,第二单击父类生成相关子类数据。
结构:TreePanel->放置TreeNode 以此迭代生成树型菜单
那么如何实现TreePanel单击取值?
第一反应:给TreePanel节点TreeNode添加单击事件TreeNode.Listeners.Click.Handler
代码:
tplMain:TreePanel的ID
//选择按钮Click function selectNode() { var selectionMode = tplMain.getSelectionModel(); var selection = selectionMode.selNode; //获取选中的值 if (selection == null) { alert("请选择"); } else { var v = selection.attributes.text; alert(v); } }
foreach (var item in childRow) { Ext.Net.TreeNode childNode = new Ext.Net.TreeNode { NodeID = item["FID"].ToString(), Text = item[rowField["DisplayField"].ToString()].ToString(), Qtip = item[rowField["DisplayField"].ToString()].ToString(), }; childNode.Listeners.Click.Handler = "selectNode() ;"; parNode.Nodes.Add(CreateNode(dtSource, childNode, item["FID"].ToString(), rowField)); }
得到的却是:假如我第一次单击的是‘华交会’得到的提示却是“请选择”, 第二次任意单击其他则得到我要的‘华交会’ ,测试发现tplMain.getSelectionModel()取到的值是null

谜底还没解除来,有ext高手的还请解释下why??
解决方法:直接给TreePanel添加单击事件TreePanel.Listeners.Click.Handler = "ClickNode(node)";
tplMain.Listeners.Click.Handler = "ClickNode(node)";
//树 单击取值主键FID function ClickNode(node) { alert(node.attributes.text); //alert(node.attributes.id); }
效果:

功能虽实现,但是第一种方法不行的原因还不是明白, 有ext高手的还请解释下why??

作者:PEPE
出处:http://pepe.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
介绍: 主要总结了Panel操作,TabPanel操作,window弹出框,MultiCombo操作,多window取值问题,GridPanel如何实现分页功能,js字符串与Ext对象转换
去年底一篇总结《ext.net 开发学习—2011 结束迎接2012》。 记录些日常开发所遇到的问题……。
人非圣贤, 写出来的当然也难免会出现一些不妥的代码,如有还请指教……
一、单击激活指定Panel:pnlAttribute.expand() (TabPanel 激活子Panel:TabPanel .setActiveTab(Panel))
<ext:Button Text="属性" runat="server" Icon="ApplicationViewDetail">
<Listeners>
<Click Handler="if(hdFoldFid.getValue()==''){alert('请选择相关文件或目录');return;}; pnlAttribute.expand(); Ext.net.DirectMethods.AttributeClick(hdFoldFid.getValue()); "/>
</Listeners>
</ext:Button>
Panel 主键ID: pnlAttribute
效果:

二、TabPanel 子Panel 显示、隐藏
eg:选择文件夹->显示Panel:常规,日志;选择文件->显示Panel:常规,版本,日志
<Click Handler="var row = gpFolderList.getSelectionModel().getSelections()[0]; hdFolderFid.setValue(row.get('FUID'));
hdFoldFid.setValue(row.get('FUID'));
Ext.net.DirectMethods.AttributeClick(hdFoldFid.getValue());
if(row.get('FileType')===null)
{
tpnlCenter.setActiveTab(pnlFoldAttribute);
#{tpnlCenter}.hideTabStripItem(0);
#{tpnlCenter}.hideTabStripItem(2);
#{tpnlCenter}.unhideTabStripItem(1);
}else
{
tpnlCenter.setActiveTab(pnlFileAttribute);
#{tpnlCenter}.hideTabStripItem(1);
#{tpnlCenter}.unhideTabStripItem(0);
#{tpnlCenter}.unhideTabStripItem(2);
}
" />
效果:

叁 指定页面以弹出框window形式展现
例如这样页面:

要以window形式弹出
主页:
前台代码:
<ext:MenuItem ID="MenuItem2" runat="server" Text="添加角色">
<Listeners>
<Click Handler="winCharacter.show();"/>
</Listeners>
</ext:MenuItem>
后台代码:
protected void Page_Load(object sender, EventArgs e)
{
CreateControl.CreateWindow("winCharacter", "角色选择", "../CommonWindow/CharacterSelection.aspx").Render(this.Form);
}
CreateControl类
public static Window CreateWindow(string wId, string wTitle, string wUrl)
{
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;
}
效果:

最终效果:

四、下拉框多选控件 MultiCombo: 后台代码加载时如何显示出已经选择的项
官方:ID.SelectedItems.Add(new SelectedListItem(value));//ID :MultiCombo 主键
其中new SelectedListItem参数可以是Index,Value 但是后台始终绑定不了,前台可以实现。
自己的解决方法: ID.SelectItem(index); //只能index,value同样实现不了
代码:
View Code
private void GetBusinessLogistic()
{
BusinessLogisticManager business = new BusinessLogisticManager();
DataTable dt = business.GetAll();
Ext.Net.ListItem item;
foreach (DataRow row in dt.Rows)
{
item = new Ext.Net.ListItem { Text = row["NC_LogisticsName"].ToString(), Value = row["BI_Seq"].ToString() };
mcobBusiness.Items.Add(item);
}
}
绑定已选项
View Code
for (int i = 0; i < dt.Rows.Count; i++)
{
for (int j = 0; j < businessList.Length; j++)
{
if (dt.Rows[i]["NC_LogisticsName"].ToString() == businessList[j])
{
mcobBusiness.SelectItem(i);
}
}
}
效果:

五、Panel页面自动加载panel
<ext:Panel ID="Tabl2" runat="server" Title="邮件管理" Border="false" BodyBorder="false">
<AutoLoad Url="MailManage/Main.aspx" ShowMask="true" Mode="IFrame">
</AutoLoad>
</ext:Panel>
六、多Window取值赋值
效果:

B窗口:
<ext:Button ID="btnSubmit" runat="server" Text="确 定" Icon="Accept">
<Listeners>
<Click Handler="var num=Store2.getCount();var depts='';
if(num>0){
for(var i=0;i<num;i++){
var deptid=Store2.getAt(i).get('RoleCode');
var deptname=Store2.getAt(i).get('RoleName');
depts=depts+deptid+','+deptname+'|';
}
}
window.parent.SetRightToDataTable(depts,2);
parent.winCharacter.hide();" />
</Listeners>
</ext:Button>
Store2为“已选数据”的数据源Store,
SetRightToDataTable:A窗口中js函数,可以通过它处理数据加载到A窗口中
winCharacter:B窗口ID
七、ComboBox不可编辑状态
代码:
View Code
<ext:CompositeField runat="server" FieldLabel="管理员角色">
<Items>
<ext:ComboBox Editable="false" Disabled="true" EmptyText="请选择管理员角色" StoreID="stRole" DisplayField="NC_RoleName"
ValueField="BI_Seq" ID="cmbRole" runat="server" Width="200">
<Triggers>
<ext:FieldTrigger Icon="Clear" Qtip="清除" />
</Triggers>
<Listeners>
<TriggerClick Handler="this.removeByValue(this.getValue());this.clearValue();" />
</Listeners>
</ext:ComboBox>
</Items>
</ext:CompositeField>
核心代码: Editable="false" Disabled="true"
效果:

.Net控件不可编辑状态常用的属性: Enabled="false" 在这里Ext.net中没效果,
ReadOnly="true" 还有其他属性则是缺胳膊少腿的

八、GridPanel 分页实现
前端大致代码:这里需注意:store下属性Proxy不可少。官方解释
“proxy:
Ext.data.DataProxy
”通俗的讲就是数据代理,另外分页页面需刷新所以别忘了“OnRefreshData“。另外GridPanel中要设置ext:PagingToolbar的storeId。
这边GridPanel中Columns中我们后端数据生成的,如果你是前台写死别忘了加上你需要的行。
<%--列表数据源--%> <ext:Store runat="server" ID="stMain" AutoLoad="true" OnRefreshData="StMain_Refresh"> <Reader> <ext:JsonReader IDProperty="ItemNo"> </ext:JsonReader> </Reader> <Proxy> <ext:PageProxy> </ext:PageProxy> </Proxy> </ext:Store> <ext:Panel ID="Panel9" runat="server" Layout="FitLayout" Frame="true"> <Items> <ext:GridPanel runat="server" ID="gpMain" StoreID="stMain" StripeRows="true" TrackMouseOver="true"> <ColumnModel ID="ColumnModel1" runat="server"> <Columns> <ext:RowNumbererColumn Locked="true" /> </Columns> </ColumnModel> <View> <ext:LockingGridView /> </View> <BottomBar> <ext:PagingToolbar ID="PgbListMain" runat="server" PageSize="50" StoreID="stMain"> <Items> <ext:Label ID="lblSearchTime" runat="server"></ext:Label> </Items> </ext:PagingToolbar> </BottomBar> <LoadMask ShowMask="true" /> </ext:GridPanel> </Items> </ext:Panel>
后端大致源码
/// <summary> /// 数据列表刷新 /// </summary> protected void StMain_Refresh(object sender, StoreRefreshDataEventArgs e) { //主要核心源码
………………
………………
int total = ……………………;//数据源总数 e.Total = total; SourceTable = …………;//数据源 _createPageManager.BindStoreColumn(stMain, FieldList, "1");//绑定主表数据源字段和主表控件字段 stMain.DataSource = SourceTable; stMain.DataBind(); }
九、设置TabPanel中当前激活Panel
设置ActiveIndex即可 示例1代表第二个激活:组织panel
<ext:TabPanel ID="TabPanel1" runat="server" Width="280" Frame="true" ActiveIndex="1"> <Items> <ext:Panel ID="plLeft" runat="server" Border="false" Title="查询" AutoScroll="true"/> <ext:Panel ID="plRight" runat="server" Border="false" Title="组 织" AutoScroll="true"> </Items> </ext:TabPanel>
十、FieldSet宽度小问题
用FieldSet做分组功能,后台代码实现。一个For循环生成FieldSet
可出来的效果有点瑕疵,第一个FieldSet宽度明显比第二、三个要宽。可是一个方法生成的为什么会出现这个问题……昨天搞了小半天,下班了就没管它,早上突然想到AutoWidth。一试 搞定
处理前页面:

处理后

贴出后台生成源码
for (int j = 0; j < pnlGroupList.Rows.Count; j++) { FieldSet fsGroup = new FieldSet { Title = pnlGroupList.Rows[j]["GroupName"].ToString(), Collapsible = true, Layout = "form", Padding = 3, AutoScroll = true, AutoWidth=true }; TableLayout tblField = new TableLayout { Columns = string.IsNullOrEmpty(structRow["RowColumnCount"].ToString()) ? 1 : Convert.ToInt32(structRow["RowColumnCount"].ToString()), }; DataRow[] showColumn = fieldList.Select( "SQLNo=1 AND IsShow=1 AND PnlFUID='" + structRow["FUID"] + "' AND GroupFUID='" + pnlGroupList.Rows[j]["FUID"] + "'", "ControlOrderNo"); foreach (DataRow row in showColumn) { Component item = CreateControl.GetControls(row, sourceRow[row["FieldAlias"].ToString()], true); Cell itemCell = new Cell(); itemCell.Items.Add(item); tblField.Cells.Add(itemCell); } fsGroup.Items.Add(tblField); pnlStruct.Items.Add(fsGroup); }
十一 、字符串与对象转换
子窗口给父窗口控件赋值:parent.父窗口控件ID.setValue(value)。
但是如果你的控件ID是通过后台代码组合而成,出来的控件ID可能就是一串字符串,此时要注意了:要使用parent.eval()方法把相关字符串转换成Ext对象。例如
control=“txtUserName”;
parent.eval(control).setValue(value);
越是小问题,越要仔细。
持续更新中……

作者:PEPE
出处:http://pepe.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
大体需求:读取指定文件->进行相关处理->新建文件并保存内容【用户选择后缀名“.mlc”文件后再把得到的".flc"文件保存到相关路径下】
解决方案:1、根据用户选择的‘.mlc’文件先上传到服务器端;
2、从服务器端取出该文件用文件流进行读取操作;
3、经过处理的文件以‘.flc’后缀保存到服务器端 ;
4、最后弹出下载框供用户下载保存。
第二种解决方案是使用ActiveX,之前的一篇《BS实现文件夹上传下载_终结篇》可以参考下。
前台代码:
1 <div> 2 <input type="hidden" id="hdFilePaht" runat="server" /> 3 <%--这里建立一个隐藏域 用来存地址--%> 4 <table style="width: 100%;" id="mytable" cellspacing="0"> 5 <tr> 6 <td align="center"> 7 离线激活 8 </td> 9 </tr> 10 <tr> 11 <td align="center"> 12 <asp:FileUpload ID="fpLoad" onchange="CheckFileType()" runat="server" /> 13 </td> 14 </tr> 15 <tr> 16 <td align="center"> 17 <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="请选择上传文件!" 18 ControlToValidate="fpLoad"></asp:RequiredFieldValidator> 19 <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ErrorMessage="仅允许上传mlc文件!" 20 ValidationExpression="^(([a-zA-Z]:)|(\\{2}\w+)\$?)(\\(\w[\w].*))+(mlc)$" ControlToValidate="fpLoad" /> 21 </td> 22 </tr> 23 <tr> 24 <td align="center"> 25 <asp:Button ID="btnActive" runat="server" Text="激 活" Enabled="False" OnClientClick="return checkNull()" 26 OnClick="btnActive_Click" /> 27 28 <asp:Button ID="btnCancel" runat="server" Text="取 消" /> 29 </td> 30 </tr> 31 </table> 32 </div>
js
FileUpload获取上传文件的路径,有说设置浏览器安全,但是毕竟不是可取的方法。这里我只限IE其实也不是很好的方法
1 function CheckFileType() { 2 if (!document.all) { 3 alert("请使用IE浏览器"); 4 return; 5 } 6 var objButton = document.getElementById("btnActive"); //激活按钮 7 var objFileUpload = document.getElementById('fpLoad'); //FileUpload 8 var FileName = new String(objFileUpload.value); //文件名 9 var extension = new String(FileName.substring(FileName.lastIndexOf(".") + 1, FileName.length)); //文件扩展名 10 if (extension == "mlc" || extension == "MLC") 11 { 12 objButton.disabled = false; //启用上传按钮 13 } 14 else { 15 objButton.disabled = true; //禁用上传按钮 16 alert('仅允许上传mlc文件!'); 17 } 18 }
后台代码:
/// <summary> /// 激活 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> protected void btnActive_Click(object sender, EventArgs e) { if (fpLoad.HasFile) { try { string filePath = hdFilePaht.Value;//文件路径 string fileExt = System.IO.Path.GetExtension(fpLoad.FileName); if (fileExt != ".mlc") { ClientScript.RegisterStartupScript(this.GetType(), "", "<script>alert('仅限mlc文件');</script>"); return; } string savePath = Server.MapPath("/mlcFile");//文件上传路径 if (!Directory.Exists(savePath)) Directory.CreateDirectory(savePath); string fileSavePath = savePath + "\\" + DateTime.Now.ToString("yyyyMMddhhmmssfff") + "_" + fpLoad.FileName; if (File.Exists(fileSavePath)) File.Delete(fileSavePath); //文件上传存在则删除 fpLoad.SaveAs(fileSavePath); byte[] btRead = FileToBinary(fileSavePath); string read = System.Text.Encoding.ASCII.GetString(btRead); …………………………
………………………………
一些数据处理(可不管)
………………………… byte[] byDataValue = System.Text.Encoding.ASCII.GetBytes(encrypt); string fileOutPath = savePath + "\\" + fpLoad.FileName.Split('.')[0] + ".flc"; if (File.Exists(fileOutPath)) File.Delete(fileOutPath); //转换后文件存在则删除 BinaryToFile(savePath, fpLoad.FileName.Split('.')[0] + ".flc", byDataValue); Response.Redirect("http://" + System.Web.HttpContext.Current.Request.Url.Authority + "/mlcFile/" + fpLoad.FileName.Split('.')[0] + ".flc"); } catch (Exception ex) { ClientScript.RegisterStartupScript(this.GetType(), "", "<script>alert('发生错误:" + ex.Message.ToString() + "');</script>"); } } else ClientScript.RegisterStartupScript(this.GetType(), "", "<script>alert('请选择上传文件');</script>"); } #region FoldHelper /// <summary>将文件转换为二进制流进行读取 /// </summary> /// <param name="fileName">文件完整名路径</param> /// <returns>文件二进制流</returns> private static byte[] FileToBinary(string fileName) { FileStream fsRead = new FileStream(fileName, FileMode.Open, FileAccess.Read); try { if (fsRead.CanRead) { int fsSize = Convert.ToInt32(fsRead.Length); byte[] btRead = new byte[fsSize]; fsRead.Read(btRead, 0, fsSize); return btRead; } else { throw new Exception("文件读取错误!"); } } catch (Exception ex) { throw new Exception(ex.Message); } finally { fsRead.Close(); } } /// <summary> 将二进制流转换为对应的文件进行存储 </summary> /// <param name="storePath">存储文件名的路径</param> /// <param name="fileName">文件名</param> /// <param name="btBinary">二进制流</param> private static void BinaryToFile(string storePath, string fileName, byte[] binary) { FileStream fsWrite = new FileStream(storePath + "\\" + fileName, FileMode.Create, FileAccess.Write); try { if (fsWrite.CanWrite) { fsWrite.Write(binary, 0, binary.Length); } } catch (Exception ex) { throw new Exception(ex.Message); } finally { fsWrite.Close(); } } #endregion
效果图:一

效果图:二

注意:效果是出来了,但不是我们要的下载页面的效果,这里还有注意如果后缀是‘.flc’ ……浏览器解析不了则显示不存在该文件 。不是不存在是浏览器它不认识。所以要进行一些设置。如下:
效果图:三: IIS设置 如果你要下载其他格式的文件,则添加进去就可以了

效果图:四

效果图:五 保存后效果


作者:PEPE
出处:http://pepe.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。


