ASP Ajax Calendar Extender and displaying time - asp.net

I am using the Ajax Control Toolkit Calendar Extender control. In some fields though I want to display the time along with the date. I have tried just setting the Format to "dd/MM/yyyy hh:mm:ss" but the time section gets wiped off. If the user wants to change the time section they can do it manually, the calendar drop down is only used for changing the date part.
Are there any workarounds or alternatives to get this working?

I have a similar issue and I'm planning to use a Date field and an associated time dropdown (in 1/2 hour increments). User sets the date in the date field, optionally using the calendar control, and pulls down to a valid time. I plan to have one selection in the time drop down be a "don't care" in case it an "all day" event.
[EDIT] I found this jquery plugin that I may end up using. I also found a link to Gaia DateTimePicker in the answers to this post (which now looks to be deleted, probably because the OP was asking for WPF controls, not web controls).

The Ra-Ajax Calendar is coming out with TIME support this upcoming Friday (28th of Nov. 2008) and it's LGPL licensed...

Based on CalendarExtender, you can set the format as "MM/dd/yyyy". After the user select the date in calendar, it will return 04/28/2009 for example. In the date selected event, you can append the current time after the date returned.
OnClientDateSelectionChanged="dateselect"
function dateselect(ev)
{
var calendarBehavior1 = $find("Calendar1");
var d = calendarBehavior1._selectedDate;
var now = new Date();
calendarBehavior1.get_element().value = d.format("MM/dd/yyyy") + " "+now.format("HH:mm:ss")
}

The only way to add time component to the AjaxControlToolKit CalendarExtender, is to append it using OnClientDateSelectionChanged and JavaScript.
<ajaxToolkit:CalendarExtender ID="ce1" runat="server" PopupButtonID="calImg" Enabled="true" Format="dd/MM/yyyy" TargetControlID="txtLeft" PopupPosition="TopRight" OnClientDateSelectionChanged="AppendTime"></ajaxToolkit:CalendarExtender>
and
<script language="javascript" type="text/javascript">
//this script will get the date selected from the given calendarextender (ie: "sender") and append the
//current time to it.
function AppendTime(sender, args) {
var selectedDate = new Date();
selectedDate = sender.get_selectedDate();
var now = new Date();
sender.get_element().value = selectedDate.format("dd/MM/yyyy") + " " + now.format("hh:mm tt");
}
</script>

Related

I need to change the fullcalendar header as each month is selected

I need to change the header as each month is selected. This includes text from a database so we are talking about ajax, which I am familiar with. I just need to know the event that is triggered on a month change and also capture the month/year that is being loaded.
The eventAfterAllRender callback option is your best bet. http://fullcalendar.io/docs/event_rendering/eventAfterAllRender/
Here's a little demo: http://jsfiddle.net/slicedtoad/jk9u53h6/1/
When all the events are finished rendering (which happens anytime the month, day or week is changed) it convert the current date into a string and replace the title text with it.
var dateChanged = function(){
var currentDate = $("#calendar").fullCalendar('getDate');
console.log(currentDate);
$('.fc-toolbar .fc-left h2').text(currentDate.format());
}
var $fc = $("#calendar").fullCalendar({
eventAfterAllRender: dateChanged,
});
Not super solid, but you should be able to make it fit your needs.

Sharepoint datetime control, how to stop taking today date

I have put SharePoint Date Time control in asp.net application page...Problem is by default it is taking Today date how to "stop tanking today date"...Thank you
I prefer using own control instead of sp date control.
var dateControl = new DateTimeControl();
dateControl.ID = "anyId";
dateControl.DateOnly = true;
dateControl.CssClassTextBox = "cssclass";
dateControl.LocaleId = Convert.ToInt32(SPContext.Current.RegionalSettings.LocaleId);
dateControl.OnValueChangeClientScript = "onApplyDateChangeValue(event)";
//if you want to set any value
dateControl.SelectedDate = DateTime.ParseExact("dateString", "dd.MM.yyyy",CultureInfo.InvariantCulture);
//Add to app page
"elementID".Controls.Add(dateControl);
It is working fine
write below code in side click function:
if (!spCal2.IsDateEmpty)
{
lblShowdtae.Text = dtSPdate.SelectedDate.ToString();
}

Validation for calender control of RadDatePicker (Telerik Controls)

I want to validate the RadDatePicker when a date is selected. User should not select greater than a particular date ? How can I restrict user from selecting a date which is not greater than a particular date.
Particular date populated from the database.
You can use CompareValidator Control.Just note to compare to your date (ValueToCompare) instead of (ControlToCompare) and set the type. By default it's string as i remember.so you need to set it to Date.Also look to this page.
On your other question:
How can I restrict user from selecting a date which is not greater than a particular date.
In C#:
RadDatePicker1.MaxDate = myMaxDateTimeVariable;
or client-side:
var radDatePicker1 = $find("<%= RadDatePicker1.ClientID %>");
radDatePicker1.set_maxDate(myMaxDate);

How to disable/strikeout previous date using AjaxToolkit CalenderExtender in asp.net 3.5

In my project, I have used CalenderExtender (which comes with AJAX Control Toolkit) in my webpages.
Now, I want my calender to strikeout or disable the previous dates.
How can I do it in CalenderExtender?
Please use the js as follow to Strike Out the Past Days:
function checkDate(sender, args) {
if (sender._selectedDate < new Date()) {
alert("You cannot select a day earlier than today!");
sender._selectedDate = new Date();
// set the date back to the current date
sender._textbox.set_Value(sender._selectedDate.format(sender._format))
}
}

How to use jQuery datepicker as a control parameter for SqlDataSource?

I have the need to display a date in this format: dd/mm/yyyy. This is actually being stored in an ASP.NET textbox and being used as a control parameter for a select on the GridView. When the query is run, though, the date format should change to 'd M y' (for Oracle). It is not working. Can someone tell me what I'm doing wrong? Right now I am pushing the "new" format to a invisible label and using the label as my control param:
$(document).ready(function() {
//datepicker for query, shown traditionally but holding an Oracle-needed format
$('[id$=txtBeginDate]').datepicker({ minDate: -7 , altFormat: 'd M y' });
//get alt format
var altFormat = $('[id$=txtBeginDate]').datepicker("option", "altFormat");
//set date to be altformat
$('[id$=lblActualDate]').datepicker("option", "altFormat", 'd M y');
});
why not do the formatting on the server-side when building your Oracle query?
System.DateTime dt = DateTime.Parse(txtBeginDate.Text);
dt.ToString("dd MM yyyy")
SqlDataSource can only use server-side asp.net controls for ControlParameters. To use your jQuery datepicker, you'll have to get a little fancy.
Put a plain Parameter and then handle the SqlDataSource's Selecting event to set the value for the parameter from the Request object (with suitable validation and formatting) by hand.

Resources