DataGrid行详细信息的绑定--DataGrid.RowDetailsTe(转载)
在Silverlight中的DataGrid控件使用中我们想点击其中一行并且看这一行的详细信息应该如何做呢?而且这个详细信息是多行的数据,而非简单的几个属性。 在这里我们使用DataGrid.RowDetailsTemplate来设置或者获取行详细信息。首先我们准备一个DataGrid命名为A,设置其RowDetailsVisibilityMode=VisibleWhenSelected (行详细信
在Silverlight中的DataGrid控件使用中我们想点击其中一行并且看这一行的详细信息应该如何做呢?而且这个详细信息是多行的数据,而非简单的几个属性。
在这里我们使用DataGrid.RowDetailsTemplate来设置或者获取行详细信息。首先我们准备一个DataGrid命名为A,设置其RowDetailsVisibilityMode="VisibleWhenSelected" (行详细信息模板的显示模式是当这行被选中的时候展开这行的详细信息。)然后再为A设置DataGrid.RowDetailsTemplate模板,并且在这个模板中添加一个DataGrid命名为B,这就是前台的XAML代码,在后台中我们设置一个实体集AList绑定到A的DataGrid,然后在AList实体集中有一个属性是BList,这个就是多行的详细信息。将BList详细信息字段绑定到B的DataGrid控件的ItemsSource即可。
下面我们来看看这个简单的应用技巧的Xaml代码如下:
<!--这里是第一个DataGrid,其DataGrid.RowDetailsTemplate模板会绑定另外一个DataGrid以显示其详细信息-->
<sdk:DataGrid x:Name="gridEmployee" CanUserReorderColumns="False" CanUserSortColumns="False"
RowDetailsVisibilityMode="VisibleWhenSelected"
HorizontalAlignment="Center" ScrollViewer.VerticalScrollBarVisibility="Auto"
Height="200" AutoGenerateColumns="False" Width="422" VerticalAlignment="Center">
<sdk:DataGrid.Columns>
<sdk:DataGridTextColumn Width="150"
Header="用户名"
Binding="{Binding UserName}"/>
<sdk:DataGridTextColumn Width="150"
Header="用户密码"
Binding="{Binding UserPwd}"/>
</sdk:DataGrid.Columns>
<sdk:DataGrid.RowDetailsTemplate>
<DataTemplate>
<!--这里是第二个DataGrid显示详细信息-->
<sdk:DataGrid AutoGenerateColumns="False" ItemsSource="{Binding UserDetailInfomation}"
HeadersVisibility="None">
<sdk:DataGrid.Columns>
<sdk:DataGridTextColumn Width="100"
Header="地址"
Binding="{Binding UserAddress}"/>
<sdk:DataGridTextColumn Width="100"
Header="城市"
Binding="{Binding UserCity}"/>
<sdk:DataGridTextColumn Width="100"
Header="国籍"
Binding="{Binding UserCountry}"/>
<sdk:DataGridTextColumn Width="100"
Header="类型"
Binding="{Binding UserState}"/>
</sdk:DataGrid.Columns>
</sdk:DataGrid>
</DataTemplate>
</sdk:DataGrid.RowDetailsTemplate>
</sdk:DataGrid>
</Grid>
然后我们来看看他的数据源的Xaml.cs代码如下:
{
public MainPage()
{
InitializeComponent();
this.gridEmployee.ItemsSource = new UserInfo().GetEmployeeData();
}
}
/// <summary>
/// 用户信息
/// </summary>
public class UserInfo
{
public string UserName { get; set; }
public string UserPwd { get; set; }
/// <summary>
/// 用户详细信息
/// </summary>
public List<UserDetailInfo> UserDetailInfomation{get;set;}
public UserInfo()
{ }
/// <summary>
/// 获取用户信息的实例
/// </summary>
/// <returns></returns>
public List<UserInfo> GetEmployeeData()
{
List<UserInfo> employees = new List<UserInfo>();
employees.Add
(
new UserInfo
{
UserName = "李伟",
UserPwd = "1333821",
UserDetailInfomation = new List<UserDetailInfo>()
{
new UserDetailInfo()
{
UserAddress="四川省成都市",
UserCity="成都",
UserCountry="中国",
UserState="当前所在地"
},
new UserDetailInfo()
{
UserAddress="四川省内江市",
UserCity="内江",
UserCountry="中国",
UserState="出生地"
}
}
});
employees.Add
(
new UserInfo
{
UserName = "Json",
UserPwd = "json282",
UserDetailInfomation = new List<UserDetailInfo>()
{
new UserDetailInfo()
{
UserAddress="广东省广州市",
UserCity="广州",
UserCountry="中国",
UserState="当前所在地"
},
new UserDetailInfo()
{
UserAddress="广东省茂名市",
UserCity="茂名",
UserCountry="中国",
UserState="出生地"
}
}
});
employees.Add
(
new UserInfo
{
UserName = "刘敏",
UserPwd = "motorola",
UserDetailInfomation = new List<UserDetailInfo>()
{
new UserDetailInfo()
{
UserAddress="湖南省长沙市",
UserCity="长沙",
UserCountry="中国",
UserState="当前所在地"
},
new UserDetailInfo()
{
UserAddress="湖南省长沙市",
UserCity="长沙",
UserCountry="中国",
UserState="出生地"
}
}
});
return employees;
}
}
/// <summary>
/// 用户详细信息的实体
/// </summary>
public class UserDetailInfo
{
public string UserAddress { get; set; }
public string UserCity { get; set; }
public string UserState { get; set; }
public string UserCountry { get; set; }
}
最后我们来看看它的运行效果,如果需要源码请点击SLDataGridRowDetail.zip下载。


本文来自程兴亮的博客,原文地址:http://www.cnblogs.com/chengxingliang/archive/2011/07/22/2112895.html
DataGrid行详细信息的绑定--DataGrid.RowDetailsTe(转载)的更多相关文章
- Silverlight实用示例 - DataGrid行详细信息的绑定DataGrid.RowDetailsTemplate
Silverlight实用示例 - DataGrid行详细信息的绑定DataGrid.RowDetailsTemplate 2012-12-28 21:04 来源:博客园 作者:chengxingli ...
- easyui datagrid行合并
easyui datagrid行合并 合并方法 /** * EasyUI DataGrid根据字段动态合并单元格 * 参数 tableID 要合并table的id * 参数 colList 要合并的列 ...
- easyUI 展开DataGrid里面的行显示详细信息
http://blog.csdn.net/yanghongchang_/article/details/7854156原著 datagrid 可以改变它的view(视图)去显示不同的效果.使用详细视图 ...
- 【全面解禁!真正的Expression Blend实战开发技巧】第七章 MVVM初体验-在DataGrid行末添加按钮
原文:[全面解禁!真正的Expression Blend实战开发技巧]第七章 MVVM初体验-在DataGrid行末添加按钮 博客更新较慢,先向各位读者说声抱歉.这一节讲解的依然是开发中经常遇到的一种 ...
- WPF设置DataGrid行内容高度自适应 与 TextBox/TextBlock内容高度自适应
WPF设置DataGrid行内容高度自适应 TextBox/TextBlock内容高度自适应 参考: DataGrid 控件中的调整大小选项: http://msdn.microsoft.com/ ...
- WPF Datagrid 动态生成列 并绑定数据
原文:WPF Datagrid 动态生成列 并绑定数据 说的是这里 因为列头是动态加载的 (后台for循环 一会能看到代码) 数据来源于左侧列 左侧列数据源 当然num1 属于临时的dome使用 可 ...
- Easyui datagrid行内【添加】、【编辑】、【上移】、【下移】
前几天项目中遇到一个需求用到了Easyui datagrd行内添加和编辑数据,同时对行内数据上移下移,所以对这几个功能做个总结. 1.首先大概说下这几个功能里用到的主要方法,行内添加数据主要是添加列的 ...
- 在命令行cmd 下,输入dxdiag 查看关于电脑许多硬件的详细信息
输入命令就可以查看本机的很多硬件的详细信息: 在命令行cmd 下,输入dxdiag 查看关于电脑许多硬件的详细信息
- WPF DataGrid某列使用多绑定后该列排序失效,列上加入 SortMemberPath 设置即可.
WPF DataGrid某列使用多绑定后该列排序失效 2011-07-14 10:59hdongq | 浏览 1031 次 悬赏:20 在wpf的datagrid中某一列使用了多绑定,但是该列排序失 ...
随机推荐
- WebStorm 快捷键收藏
快捷键 Ctrl+/ 或 Ctrl+Shift+/ 注释(// 或者/-/ ) Ctrl+X 或 Ctrl+Y 删除一行 Shift+F6 重构-重命名 Alt+~vcs操作 Alt+~ 7关闭重 ...
- mysql数据库表格导出为excel表格
在本地数据库中操作如下: 由于excel表格的编码是GBK,所以导出时要加一个设置字符编码: select * from 某个表 into outfile 'd:/文件名.xls' CHARACTER ...
- C程序调用shell脚本共有三种方法
C程序调用shell脚本共有三种法子 :system().popen().exec系列函数call_exec1.c ,内容为:system() 不用你自己去产生进程,它已经封装了,直接加入自己的命令e ...
- mvvm结构中数据的关联----wpf
1.在视图中PlotView.xaml <Button Content="<<" Height="23" HorizontalAlignmen ...
- Antelope 和Barracuda区别
Antelope是innodb-base的文件格式, Barracude是innodb-plugin后引入的文件格式,同时Barracude也支持Antelope文件格式.两者区别在于: 文件格式 支 ...
- Jquery each 的跳出 break continue
在Jquery each 中 break 是用 return false; continue 是用 return true;
- phpcms v9 企业黄页系统发布没有表单出现的解决方案
第一种解决方案: 第一步:把yp_UTF8压缩文件解压得到:api.caches.phpcms.statics四个文件夹. 第二步:把这四个文件夹分别覆盖已安装好的phpcms系统根目录下的文件夹.这 ...
- 利用getchar()消除多余字符数据(主要是“回车”)
- cocos2dx中常见的类及类继承关系
场景:CCScene,继承自CCNode,几乎完全等于CCNode类 CCNode继承自CCObject,CCObject是真正意义上的父类,CCObject又继承自CCCopying类,CCCopy ...
- SlimDx绘制点图元的问题
问题:点图元在自己创建的三维环境里渲染不出来,代码如下: GMCustomVertex.PositionNormalColored wellPart = new GMCustomVertex.Posi ...