MOSS自带SPDatePickerControl控件的使用

每个人的博客园子上都有个小日历，挺好的，像在MOSS的Blog模板中加入一个这样的日历，

很简单，

不需要任何代码，用Designer搞搞就可以。

 

1. 加入脚本
   
   function MoveToViewDate(strdate, view_type) {
       var wUrl=window.location.href;//blogs/default.aspx?CalendarDate=2008%2F8%2F22&DashedDate=2008-8-22
       var gUrl ="/blogs/Lists/Posts/Calendar2.aspx";//blogs/Lists/Posts/Calendar.aspx?CalendarPeriod=day&CalendarDate=2008%2F8%2F15
       if (strdate !=null) {
           wUrl=StURLSetVar2(wUrl, "CalendarDate", escapeProperly(strdate));
           gUrl=StURLSetVar2(gUrl, "CalendarDate", escapeProperly(strdate));
           var M=localizedDate.indexOf("2");
           var D=localizedDate.indexOf("3");
           var Y=localizedDate.indexOf("1999");
           var index=0;
           for (var i=0; i < localizedDate.length; i++) {
               switch(i) {
                   case M:
                       M=index++;
                       break;
                   case D:
                       D=index++;
                       break;
                   case Y:
                       Y=index++;
                       break;
               }
           }
           var ch="-1";
           var chars=new Array("\u002f","-");
           for (var i=0; i < chars.length; i++) {
               if (strdate.indexOf(chars[i]) !=-1) {
                   ch=chars[i];
                   break;
               }
           }
           var darray=strdate.split(ch);
           wUrl=StURLSetVar2(wUrl, "DashedDate", darray[Y]+"-"+darray[M]+"-"+darray[D]);
           gUrl=StURLSetVar2(gUrl, "DashedDate", darray[Y]+"-"+darray[M]+"-"+darray[D]);
       }
       view_type = "day";
       if (view_type !=null)
       {
           wUrl=StURLSetVar2(wUrl, "CalendarPeriod", view_type);
           gUrl=StURLSetVar2(gUrl, "CalendarPeriod", view_type);
       }
         window.location=gUrl;
        // window.open(gUrl);
   }
   
2. 修改脚本：_layouts/2052/CORE.JS （先备份哦）
   
   function MoveToViewDate(strdate, view_type)
   {
       var wUrl=window.location.href;
       if (strdate !=null){
           wUrl=StURLSetVar2(wUrl,"CalendarDate",escapeProperly(strdate));}
       if (view_type !=null){
           wUrl=StURLSetVar2(wUrl,"CalendarPeriod",view_type);}
                    var localizedDate ="1999-02-03";
                   var M=localizedDate.indexOf("2");
           var D=localizedDate.indexOf("3");
           var Y=localizedDate.indexOf("1999");
           var index=0;
           for (var i=0; i < localizedDate.length; i++) {
               switch(i) {
                   case M:
                       M=index++;
                       break;
                   case D:
                       D=index++;
                       break;
                   case Y:
                       Y=index++;
                       break;
               }
           }
           var ch="-1";
           var chars=new Array("\u002f","-");
           for (var i=0; i < chars.length; i++) {
               if (strdate.indexOf(chars[i]) !=-1) {
                   ch=chars[i];
                   break;
               }
           }
           var darray=strdate.split(ch);
           wUrl=StURLSetVar2(wUrl, "DashedDate", darray[Y]+"-"+darray[M]+"-"+darray[D]);
   
       SubmitFormPost(wUrl, true);
   }
3. 在模板页中任意地方加入日期控件代码
   
   <div>
     <script type="text/javascript">
           var localizedDate = '1999-02-03'; 
   <script type="text/javascript" language="javascript" src="overrideCalendar.js" defer=""></script> <SharePoint:SPDatePickerControl ID="DPC1" SelectedDate="{$SelectedDate}"  EndOffset="0" StartOffset="0" runat="server" LangId="2052" LocaleId="2052"/>
   </div>
   
4. 注意：overrideCalendar.js为第一步创建的脚本，可以放在磁盘或者Designer下。建议丢磁盘。快！
5. 用Deigner打开日历列表的Calendar.aspx 页，复制一份以得到如下地址： var gUrl ="/blogs/Lists/Posts/Calendar2.aspx"，主要实现和园子里的日历功能：按照日期过滤：
6. 示例，
7. 更高级的用法：加载XML文件

 

<WebPartPages:DataFormWebPart runat="server" SuppressWebPartChrome="False" Description="" PartImageSmall="" DataSourceID="" MissingAssembly="无法导入此 Web 部件。" FrameType="None" ConnectionID="00000000-0000-0000-0000-000000000000" DetailLink="" ExportControlledProperties="True" IsVisible="True" AllowRemove="True" AllowEdit="True" ID="g_93e2cc52_d577_4396_99d1_7a83c0d3db86" Dir="Default" FrameState="Normal" ViewContentTypeId="" AllowConnect="True" PageSize="-1" AllowMinimize="True" IsIncludedFilter="" ShowWithSampleData="False" ChromeType="None" HelpMode="Modeless" ExportMode="All" ViewFlag="0" Title="会议室日历" HelpLink="" AllowHide="True" AllowZoneChange="True" PartOrder="2" UseSQLDataSourcePaging="True" PartImageLarge="" IsIncluded="True" NoDefaultStyle="TRUE" __MarkupType="vsattributemarkup" __WebPartId="{93E2CC52-D577-4396-99D1-7A83C0D3DB86}" __AllowXSLTEditing="true" WebPart="true" Height="" Width=""><DataSources>
<SharePoint:SPXmlDataSource runat="server" DataFile="" AutoSave="True" XPath="" ID="SPXmlDataSource1"><DataFileParameters><asp:Parameter DefaultValue="empty.xml" Name="FileName"></asp:Parameter><asp:Parameter Name="FilePath"></asp:Parameter>
</DataFileParameters>
</SharePoint:SPXmlDataSource>
</DataSources>
<ParameterBindings>
        <ParameterBinding Name="FileName" Location="None" DefaultValue="empty.xml"/>
        <ParameterBinding Name="FilePath" Location="None" DefaultValue=""/>
        <ParameterBinding Name="SelectedDate" Location="QueryString(CalendarDate)"/>
    </ParameterBindings>
<DataFields>text(),root;</DataFields>
<Xsl>
<xsl:stylesheet version="1.0" exclude-result-prefixes="xsl msxsl ddwrt" xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime" xmlns:asp="http://schemas.microsoft.com/ASPNET/20" xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:msxsl="urn:schemas-microsoft-com:xslt" xmlns:SharePoint="Microsoft.SharePoint.WebControls" xmlns:ddwrt2="urn:frontpage:internal">
    <xsl:output method="html" indent="no"/>
    <xsl:decimal-format NaN=""/>
    <xsl:param name="FileName" />
    <xsl:param name="SelectedDate" />
    <xsl:variable name="dvt_1_automode">0</xsl:variable>
    <xsl:template match="/">
        <xsl:call-template name="dvt_1"/>
    </xsl:template>
    <xsl:template name="dvt_1">
    <div>
      <script type="text/javascript">
        var localizedDate = &apos;<xsl:value-of select="ddwrt:FormatDate('1999-02-03','2052',1)" />&apos;;
        </script> <script type="text/javascript" language="javascript" src="overrideCalendar.js" defer=""></script> <SharePoint:SPDatePickerControl ID="DPC1" SelectedDate="{$SelectedDate}"  EndOffset="0" StartOffset="0" runat="server" LangId="2052" LocaleId="2052"/></div>
    </xsl:template>
</xsl:stylesheet>    </Xsl>
</WebPartPages:DataFormWebPart>

 

 

 日历的数据源可以动态指定哦。