本章演示在页面上一个SmartGrid中的数据变化时,删除另外一个SmartGrid中与该SmartGrid中变化的数据重复数据的示例。
首先我们在页面上放两个SmartGrid控件,ID分别为SmartGrid1与SmartGrid2,代码如下:
<body >
<form id="form1" runat="server" >
<SmartWeb:SmartGrid ID="SmartGrid1" runat="server" ColumnSizeable="true" ColumnMovable="true"
Height="200px" ReadOnly="false" DataKeyField="ID" Width="300px" AllowDelete="true"
AllowAdd="true" OnRowDataCheck="myRowDataCheck" >
<Columns >
<SmartWeb:TextBoxColumn ColumnName="A" HeaderText="A" / >
<SmartWeb:TextBoxColumn ColumnName="B" HeaderText="B" / >
</Columns >
</SmartWeb:SmartGrid >
<br / >
<br / >
<SmartWeb:SmartGrid ID="SmartGrid2" runat="server" ColumnSizeable="true" ColumnMovable="true"
Height="200px" ReadOnly="false" DataKeyField="ID" Width="300px" AllowDelete="true"
AllowAdd="true" >
<Columns >
<SmartWeb:TextBoxColumn ColumnName="A" HeaderText="A" / >
<SmartWeb:TextBoxColumn ColumnName="B" HeaderText="B" / >
</Columns >
</SmartWeb:SmartGrid >
</form >
</body >
然后我们要明确"重复的数据"这个概念,所谓重复的数据,必定是指数据的主键值重复了,所以我们要先明确到底是那些列的数据重复了我们就认定这一行的数据是重复的。在本例中,我们的假定A列为主键列,只要A列的值重复了,那么我们就认为该行的数据有重复了。如果大家在自己的项目中是多个列的组合主键,那么也只需要稍稍改变后面的js就行了。
在上面的代码中可以看到,我们为SmartGrid1设置了myRowDataCheck事件,该事件是行验证事件,该事件说明如下:
在编辑状态下,用户完成行的编辑后离开当前行时,SmartGrid触发OnRowDataCheck脚本事件,程序员可以响应该事件以对用户的录入进行校验。具体可以看以下链接:
SmartGrid控件使用教程(二)-前台脚本编程然后完成myRowDataCheck事件中的代码:
<script type="text/javascript" language="javascript" >
function myRowDataCheck(grid, ev) {
var keyvalue = grid.getCellValue(grid.row, "A");
var grid_SmartGrid2 = document.getElementById('<%=this.SmartGrid2.ClientID % >');
var grid_SmartGrid2_keyvalue;
for (var i = 0; i < grid_SmartGrid2.rowCount; i++) {
grid_SmartGrid2_keyvalue = grid_SmartGrid2.getCellValue(i, "A");
if (grid_SmartGrid2_keyvalue = keyvalue) {
grid_SmartGrid2.delRowForced(i);
grid_SmartGrid2.focus(0);
grid_SmartGrid2.blur(0);
}
}
}
</script >
上面的代码应该比较容易理解,主要讲解一下
grid_SmartGrid2.focus(0);
grid_SmartGrid2.blur(0);
这两行代码,本来这两行代码是不需要的,但因为如果在删除行后不重新为SmartGrid2设置焦点,它被删除的行不会马上消失,要SmartGrid2再次获得焦点时才会消失,这应该也算是SmartGrid控件的一个bug吧。
下面是js用到的两个方法讲解:
1,
delRowForced:强制删除指定行
语法:delRowForced(int rowIndex)
删除行后SmartGrid会自动跳到下一行。如果rowIndex < 0 或 rowIndex > 总行数 – 1,则不执行删除。
2,
getCellValue:SmartGrid前台栏位取值方法
语法:getCellValue(int rowIndex,string colName)
上面两个方法具体讲解可以查看:
SmartGrid教程(四):数据与行操作效果演示:
1,先为SmartGrid2添加两行数据,如下图:
2,再为SmartGrid1添加一行数据,该行数据的A列的值为a,即与SmartGrid2的第一行的A列的值一样,添加完后,鼠标移到第二行,我们会发现SmartGrid2的第一行的数据被自动删除了,如下图:
至此,本章功能完成!Qpenc揯0<