欢迎来到.net学习网

欢迎联系站长一起更新本网站!QQ:879621940

您当前所在位置:首页 » ASP.Net » 正文

热门阅读

SmartGrid中下拉列DropDownListColumn列使用实例

创建时间:2012年03月05日 21:37  阅读次数:(6601)
分享到:
在SmartGrid的实际使用中,如果需要用户输入的数据是固定几项的,那么最好把这个列做成DropDownListColumn列,一是方便用户快速输入数据,二是避免用户手动输入错误的信息。那么我们如何在SmartGrid中绑定DropDownListColumn列呢?

从DropDownListColumn列的类名我们就可以看出来,这一列的表现形式是与DropDownList一样的。DropDonwList有两个主要的属性,一个是Text,一个Value,Text值主要用来显示给用户看,而Value主要用来存储实际的值。比如一个用来存储地区的DropDownList控件,显示值有”长沙”,”深圳”,”北京”,而这三个地区在数据库中可能只是存储它们的编码”001”,”002”,”003”,那么我们就是用ListItem将它们组合起来。

同样,DropDownListColumn列也需要另一个列来配合存储该列的实际的值,当然,如果你的DropDownListColumn的显示值与实际值是一样的,就可以不需要另一个列来存储值了。 

如果有对SmartGrid列还不太清楚的朋友,可以下载本站的SmartGrid帮助文档,以便查阅。

下面我们来做一个具体的实例:
SmartGrid列即可以在aspx页添加,也可以在cs页,通过后台代码添加,本实例我们主要讲解在cs页用后台程序的方法添加.在aspx页添加的方式就一下带过去了,如下面代码:
<SmartWeb:SmartGrid ID="grid" runat="server" AllowAdd="False" AllowDelete="True" DataKeyField="ID" >
    <Columns >
        <SmartWeb:DropDownListColumn ColumnName="address" HeaderText="地区" EditMode="Embedding"
            EditorClientScriptUrl="../../htc/droplist.htc" ExtendedProperties="<?xml version='1.0'? ><Info  valueColumn=addressvalue/ >" / >    
    </Columns >
</SmartWeb:SmartGrid >


主要我们从后台添加,如下代码:
//声明一个DropDownListColumn列
SmartGridColumn col == new DropDownListColumn();

//将该列添加到SmartGrid中,grid为SmartGrid的ID。
this.grid.Columns.Add(col);
col.ColumnName = "address";
col.HeaderText = "地址";

//设置该列的htc文件,htc是SmartGrid中一个非常重要的文件,我们很多的功能都是在htc文件中
col.EditorClientScriptUrl = "htc/Mydropdownlist.htc";

//下句代码中valueColumn属性设置用来存储该列的实际值的列,我们在取下拉列的实际值时,就要取valueColumn设置的列的值
col.ExtendedProperties = "<?xml version='1.0'? ><Info valueColumn=addressvalue/ >";

//初始化该列的下拉框
DropDownList l = col.ControlEditor as DropDownList;
l.Items.Add(new ListItem("长沙","001"));
l.Items.Add(new ListItem("深圳","002"));
l.Items.Add(new ListItem("北京","003"));

//初始化addressvalue列
SmartGridColumn col = col = new SmartGridColumn();
this.grid.Columns.Add(col);
col.HeaderText = "地区编号";
col.ColumnName = "addressvalue";
col.Visible = false;//把这一列隐藏改起来,不让用户看到

这样,我们就把一个DropDownListColumn列初始化好并添加到SmartGrid中了。但这时的address值并不能和addressvalue联动起来。还需要htc文件支持。下面我们看看htc文件:
<script language="javascript" >//列表框一般有两个值,一个是Text,一个是value。valColumn指明存储选择的value的Grid列
var valColumn = null;
var extendedProp = element.extendedProperties;
if(typeof(extendedProp) != "undefined")
{
var dom = new ActiveXObject("MSXML.DOMDocument");
dom.loadXML(extendedProp);

valColumn = dom.documentElement.getAttribute("valueColumn");
}
//当离开编辑时,根据编辑器的内容给相关的单元格赋值
function getValue()
{
var r = grid.row;
var val = element.options[element.selectedIndex].value;

//如果有储存value的列,则将当前选择项的值放到该列中
if(valColumn != null)
{
grid.setCellValue(r,valColumn,val) ;
}

return element.options[element.selectedIndex].text;
}

//当进入编辑时,根据当前单元格的内容,给编辑器赋值
function setValue(vVal)
{
var r = grid.row;
var val = vVal;

//如果有储存value的列,则从该单元格取值
if(valColumn != null)
{
   val = grid.getCellValue(r,valColumn);
}

var options = element.options;
var length = options.length;
for(var i=0;i<length;i++)
{
var option = options[i];
if(option.value == val)
{
    option.selected = true;
    return;
}
}
}
</script >

从上面代码中可以看出来,在htc中,使用了SmartGrid的getCellValue与setCellValue方法,将两列的值真正的联动起来了。

好了,一个SmartGrid的下拉列终于完成了!d
来源:.net学习网
说明:所有来源为 .net学习网的文章均为原创,如有转载,请在转载处标注本页地址,谢谢!
【编辑:

打赏

取消

感谢您的支持,我会做的更好!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

最新评论

共有评论1条
  • #1楼  评论人:匿名  评论时间:2013-7-23 10:57:31
  • 非常感谢,帮大忙了。
发表评论:
留言人:
内  容:
请输入问题 7+8=? 的结果(结果是:15)
结  果: