在Windows应用程序中,可以使用日期控件选择日期,代替直接输入,这样的好处是日期格式不会错误,而且界面比较友好。又比如我需要在输入框中填写一个单位的编码,可是单位的编码很难记,需要查询得到,这在WinForm中同样很容易实现,在WebForm中,我们模仿WinForm的实现方式:打开一个新窗口,在新窗口中查询得到结果,选择记录行,将结果返回到父窗口的相应输入框中。
需要输入数据的界面(父窗口):InputData.aspx
<a href="javascript:linkfind_window=window.open('getDepart.aspx?controlname=Form1.txtDepartID','linkfind_window','width=500,height=500');linkfind_window.focus()">选择</a>
打开的新窗口的页面为:getDepart.aspx,参数为controlname=Form1.txtDepartID,其中Form1为页面InputData.aspx中的表单名称(ID),txtDepartID为输入框控件的ID。
子页面:getDepart.aspx
在该页面中用DataGrid或者DataList列出所有的单位编码和单位名称,这样操作者就非常清楚,直接用鼠标点击相应的行,将选择的单位的编码返回到父页面InputData.aspx的控件txtDepartID中。
其实将值返回父页面非常简单,语法如下:
javascript:window.opener.Form1.txtDepartID.value = '0401-203';
它表示将'0401-203'赋值给父窗口的输入框txtDepartID。
相信在浏览器的两个窗口中传递值的语法大家都很熟悉,现在的问题是需要在子窗口的DataGrid中每行都加入相应的代码,使得鼠标点击相应的行可以将行中相应的值返回到父页面,并关闭页面本身。为了使选择数据更加生动一些,可以加入行背景变色的效果。
下面是最终的显示效果的html代码:
<td>0401-203</td><td>测试单位名称一</td>
</tr>
可以看到,我们加入了背景变色的动态效果,但是最关键的是需要生成onclick的代码,在我的另外一片文章《用户操作“确认” 》中,介绍了如何在DataGrid中为单元格中的控件添加JavaScript代码,我们这里可以借鉴,但是区别在于:
1、为DataGrid的每行添加JavaScript代码,而不是单元格
2、需要取得DataGrid的每行的Cell(0)的值
我直接使用了前面的代码进行修改,代码如下:
Dim dgi As DataGridItem = e.Item
Dim strUrl As New StringBuilder(64)
If (dgi.ItemType = ListItemType.Item OrElse dgi.ItemType = ListItemType.AlternatingItem) Then
' 本例只检查DataGrid的Item和AlternatingItem行
dgi.Attributes.Add("onmouseover", "this.style.backgroundColor='#cccccc'")
dgi.Attributes.Add("onmouseout", "this.style.backgroundColor='white'")
dgi.Attributes.Add("onclick", strUrl.Append("javascript:window.opener.").Append("Form1.txtDepartID").Append(".value = '").Append(dgi.Cells(0).Text).Append("';window.close();").ToString)
End If
End Sub
实际运行时,DataGrid的每行都生成了前面所示的代码,但是value的值却都是空,而不是Cells(0)单元格中的单位编,经过跟踪程序发现在DataGrid的ItemCreated事件中,只有每一项ItemCreated事件发生以后Cells(i).Text才有值,而在事件发生时是没有值的。看来需要在其他事件发生时进行处理才能得到需要的值。查看了一下DataGrid的事件列表,发现ItemDataBound事件,将代码移动到该事件中,一切正常。最终代码如下:
Dim dgi As DataGridItem = e.Item
Dim strUrl As New StringBuilder(64)
If (dgi.ItemType = ListItemType.Item OrElse dgi.ItemType = ListItemType.AlternatingItem) Then
' 本例只检查DataGrid的Item和AlternatingItem行
dgi.Attributes.Add("onmouseover", "this.style.backgroundColor='#f1f5e1'")
dgi.Attributes.Add("onmouseout", "this.style.backgroundColor='white'")
dgi.Attributes.Add("onclick", strUrl.Append("javascript:window.opener.").Append(Convert.ToString(ViewState("FORMCONTROL"))).Append(".value = '").Append(dgi.Cells(0).Text).Append("';window.close();").ToString)
End If
End Sub