Using AJAX with an asp:Calendar

Question

Total newb to .NET programming (and AJAX) but I've been working on this program a while. Many things I state in this question might not make sense, so please correct me where my understanding is off.

Right now I've got an ASP:Calendar which has this property: OnSelectionChanged = "SelectionChanged". So the SelectionChanged method is called on the server when the user clicks on the calendar. But this requires a postback, which is crazy slow -- in terms of my program, there's no need for the server to be involved at this point; the client can handle everything.

So I'd like to handle it with javascript. Have some kind of way for clicking the asp:Calendar to trigger a piece of javascript code. Do I do this with a some kind of ajax extender? Or is there another way?

Answer 1

I've used the jQuery datepicker before which doesn't do a postback when a date is chosen.

Answer 2

Well, you can use the standard .NET AJAX controls, they are pretty simple to implement....

Basically, you need to first include a script manager in your markup, nothing complicated about that. Just make sure it is in the tags.

You want to wrap the part of your page you want to be accessible on the AJAX postback in an UpdatePanel tag. The update panel will require a ContentTemplate, which is where all of your actual page content goes. It will also require a Trigger tag, that is where you specify the controls and events you want to fire off the postback. Any control that you want to fire an AJAX postback on must have its AutoPostBack property set to "true".

Here's the basic layout:

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel runat="server" ID="UpdatePanel1">
<ContentTemplate>
<asp:Label runat="server" ID="UpdateMe"/>
<asp:TextBox runat="server" ID="AjaxTextBox" AutoPostBack="true" OnTextChanged="AjaxTextBox_TextChanged/>
</ContentTemplate>

<Triggers>
<asp:AsyncPostBackTrigger ControlID="AjaxTextBox" EventName="TextChanged" />
</Triggers>
</asp:UpdatePanel>

Now, these days I don't think this is the preferred method of doing things. Most web-devs are using the jquery AJAX methods to handle it, but this is a quick-and-easy way to get started I suppose. Jquery AJAX methods aren't at all difficult, though. Certainly something else worth looking into...but I don't prefer to use controls like the Calendar with Jquery AJAX. For those cases, I use the jquery-ui calendar control. The cost of having to convert and check datetimes is minimal compared to dealing with heavily customized .NET controls intermixed with Jquery AJAX.