SPS中自定义Web part中日历控件的添加

项目中需要实现一个基本的页面应用,其中需要选择日期,本来这在ASP.net是一件很容易的事情,但是移到SPS的web part上实现就比原来复杂的多,经过两天的努力终于最终实现了,现总结一下这方面开发需要注意的事情.(.net版本是1.1的)
首先遇到这个问题的人一定首先想到用SPS本身提供的日历控件,我也不例外,但是经过多方查询,发现使用本身提供的控件不但是找不到相关的接口说明,而且它本身提供的日历控件必须放到SPS指定的一个Table类型里,这就会影响到本身应用的其他功能.
此路不通,无奈,只能采用js日历控件来实现了.于是去网上找了一个看上去不错的js日历程序,该程序需要通过js的回调事件来实现选择完日历输出到的文本框名称.而且日历选择的点击功能也是需要实现一个function来实现的.这样来看就需要解决几件事情,第一,在自定义Web part中如何引用js文件.第二,write之后的文本框控件名称如何指定(经过output输出的文本框名称要么没有,要么是一段很长的随机名称,只有名称最后几位是你可以利用的).第三,如何将带有js function的这段javascript代码放到你想放到的页面位置上,来实现日历点击图标.
问题出现了,一个一个解决.对于第一个问题,由于本项目中已经对SPS和WSS门户的总结构进行了调整,即更换了整个网站的Header部分,取而代之的是一个静态的html页面,这就使问题比较简单了,直接把<script language="javascript" type="text/javascript" src="./Calendar.js"></script>添加到这个Header.htm部分就可以了,至于文件的位置,你可以放到通用的sps统一存放js文件的地方.
第二个问题:可以作个试验,如果我们只是new了一个textbox,名称为txtStartDate,然后经过output之后,返回的页面html会显示如下部分:<input type="text"/>,如果你在多做一步,this.control.add(txtStartDate),你就会发现html会变成<input type="text" id="TopZone_g_a28c3ca4_d54b_4326_ae82_1e1f310c8fda_ctl0" />,最后一部分的_ctl0是随着你页面控件的数量和放置位置而生成的.如果你想识别自己认识的控件名称,那你需要再做一点工作,txtStartDate.ID = "txtStartDate".这个时候,输出的html就变成<input name="TopZone:g_a28c3ca4_d54b_4326_ae82_1e1f310c8fda:txtStartDate" type="text" id="TopZone_g_a28c3ca4_d54b_4326_ae82_1e1f310c8fda_txtStartDate" />,ok有了这个信息,我们就可以通过一些js技巧来指定日历选择完之后的控件名称了(此部分不说明了).注意,ID的设定一定要在createchildcontrol那个重载方法里,千万不要放在RenderWebpart里,否则文本框的值在提交的时候,服务端就取不到了.
第三个问题:实际第三个问题很多网友都已经介绍过了,我这只少说几句,总结一下,CreateChildControls()用来new控件,生成好的控件一定要Control.Add,如:

txtStartDate  =   new  TextBox();
txtEndDate  =   new  TextBox();
txtStartDate.ID  =   " txtStartDate " ;
txtEndDate.ID  =   " txtEndDate " ;
this .Controls.Add(txtStartDate);
this .Controls.Add(txtEndDate);

RenderWebPart()用来输出布局,同时提交控件和你的自定义html或js,如:

EnsureChildControls();
output.RenderBeginTag(HtmlTextWriterTag.Table);
// tr begin
output.RenderBeginTag(HtmlTextWriterTag.Tr);
output.RenderBeginTag(HtmlTextWriterTag.Td); 
txtStartDate.RenderControl(output);
output.Write(BuildCalendar(txtStartDate.ID));
txtEndDate.RenderControl(output);
output.Write(BuildCalendar(txtEndDate.ID));
output.RenderEndTag();
output.RenderEndTag();
// tr end
output.RenderEndTag();

完成了这些,你的自定义开发控件的日历控件就应该可以使用了.:)

转载于:https://www.cnblogs.com/leospring/archive/2006/02/23/335953.html