在Windows应用程序中,可以使用日期控件选择日期,代替直接输入,这样的好处是日期格式不会错误,而且界面比较友好。又比如我需要在输入框中填写一个单位的编码,可是单位的编码很难记,需要查询得到,这在WinForm中同样很容易实现,在WebForm中,我们模仿WinForm的实现方式:打开一个新窗口,在新窗口中查询得到结果,选择记录行,将结果返回到父窗口的相应输入框中。
需要输入数据的界面(父窗口):InputData.aspx
打开的新窗口的页面为: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代码:
可以看到,我们加入了背景变色的动态效果,但是最关键的是需要生成onclick的代码,在我的另外一片文章《用户操作“确认” 》中,介绍了如何在DataGrid中为单元格中的控件添加JavaScript代码,我们这里可以借鉴,但是区别在于:
1、为DataGrid的每行添加JavaScript代码,而不是单元格
2、需要取得DataGrid的每行的Cell(0)的值
我直接使用了前面的代码进行修改,代码如下:
实际运行时,DataGrid的每行都生成了前面所示的代码,但是value的值却都是空,而不是Cells(0)单元格中的单位编,经过跟踪程序发现在DataGrid的ItemCreated事件中,只有每一项ItemCreated事件发生以后Cells(i).Text才有值,而在事件发生时是没有值的。看来需要在其他事件发生时进行处理才能得到需要的值。查看了一下DataGrid的事件列表,发现ItemDataBound事件,将代码移动到该事件中,一切正常。最终代码如下: