Skip to content

Using OCalendar and problems with it

February 13, 2012

I have used for the custom date and time picker with OCalendar from Obout, dunno if you’ve heard of them. Their controls are very easy to plug in and use off the shelve despite miniscule tutorial implementation.

I had wrote the following to add the OBout OCalendar control to select a date and pick a time to place into the text fields: –

 

<%@ Page Title=”” Language=”C#” MasterPageFile=”~/default.master” AutoEventWireup=”true” CodeFile=”page1.aspx.cs” Inherits=”page1″ %>

<%@ Register assembly=”obout_Calendar2_Net” namespace=”OboutInc.Calendar2″ tagprefix=”obout” %>

<asp:Content ID=”Content1″ ContentPlaceHolderID=”content” Runat=”Server”>

<script type=”text/javascript”>
// get the calendar control image object
var clnStartTime = document.getElementById(“_<%=clnStartTime.ClientID%>Button”);
// set a custom function on the mouseover event of the datepicker image
clnStartTime.onmouseover = function() { clnStartTime.setDate(new Date(), new Date()) };

// get the calendar control image object
var clnEndTime = document.getElementById(“_<%=clnEndTime.ClientID%>Button”);
// set a custom function on the mouseover event of the datepicker image
clnEndTime.onmouseover = function() { clnEndTime.setDate(new Date(), new Date()) };

// get the calendar control image object
var clnFixedExpiryTime = document.getElementById(“_<%=clnFixedExpiry.ClientID%>Button”);
// set a custom function on the mouseover event of the datepicker image
clnFixedExpiryTime.onmouseover = function() { clnFixedExpiryTime.setDate(new Date(), new Date()) };
</script>

 

<table>
<tr>
<td>Valid From Time</td>
<td>&nbsp;</td>
<td><asp:TextBox ID=”txtStartTime” runat=”server”></asp:TextBox>
<obout:Calendar ID=”clnStartTime” runat=”server” TextBoxId=”txtStartTime” DatePickerMode=”true” DatePickerImagePath=”../images/calendar.gif” DateFormat=”M/d/yyyy hh:mm:ss” ShowTimeSelector=”true” >
</obout:Calendar>
</td>
</tr>
<tr>
<td>Valid To Time</td>
<td>&nbsp;</td>
<td><asp:TextBox ID=”txtEndTime” runat=”server”></asp:TextBox>
<obout:Calendar ID=”clnEndTime” runat=”server” TextBoxId=”txtEndTime” DatePickerMode=”true” DatePickerImagePath=”../images/calendar.gif” DateFormat=”M/d/yyyy hh:mm:ss” ShowTimeSelector=”true”>
</obout:Calendar>
</td>
</tr>

</table>

This allows you from the javascript to select a time from the calendar control located at the bottom which the date and time gets plugged into the text box once you select the date and time.

 

This is fine, but I have found several re-occuring problems with the error,

String was not recognized as a valid DateTime.

Not sure why this occurs!

Advertisements

From → Uncategorized

Leave a Comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: