CalendarExtender: selected

Showing posts with label selected. Show all posts

Wednesday, March 28, 2012

Calling Clinet Function from Code Behind (Inside Ajax Update panel)

Hi,

Can anyone please provide information on how I can do this:

I have a GridView control inside an Ajax Update panel and have wired the Selected IndexChanged action to call a Client side Javascript function (ViewReceipt()). Unfortunately it doesn't seem to work except if I take the control outside the update panel.

Have posted my code below..

Regards..

Peter.

Hi,

Found some posts on this and tried to add the recommended code but still getting a syntax error, hope someone can help out..

code behind:

protected void rgvInv_SelectedIndexChanged(object sender, EventArgs e)
{
// Now execute the client-side stuff...
StringBuilder sbScript = new StringBuilder();
sbScript.Append("\n<script language=\"JavaScript\" type=\"text/javascript\">\n");
sbScript.Append("\n");
sbScript.Append("</script>\n");
//this.RegisterStartupScript("ClientSideCall", sbScript.ToString());
//ScriptManager.RegisterStartupScript(this.UpdatePanel1, this.GetType(), "ClientSideCall", sbScript.ToString(), true);
ScriptManager.RegisterStartupScript(this, this.GetType(), "ClientSideCall", sbScript.ToString(), true);

}

Javascript Function:

function EditReceipt()
{
var manager = GetRadWindowManager();
var rwEntry = manager.GetWindowByName("rwReceipt");
}

Regards..

Peter.

Hi Peter,

The problem with your code is that you should specify the last parameter to false in RegisterStartupScript method.

This parameter indicates that <script> tag will be added automatically to wrap the sbScript. Since you've done that manually, so false should be used.

Like this:

ScriptManager.RegisterStartupScript(this, this.GetType(), "ClientSideCall", sbScript.ToString(), false);

Hope this helps.

Hi Peter,

Give full definition of EditScript() function then only I can help to you.

Regards,

Aru

Raymond,

Thanks for the information, I have already implemented a work around by moving the grid outside of the update panel. I'm using a telerik grid which has inbuilt AJAX and there are some clientside events which can be hooked into that has given me the functionality I require, anyway thanks for the information I can use it else where later.

Regards..

Peter Big Smile

Saturday, March 24, 2012

calendarextender: popupbuttonid

I am trying to call a function on my code behind page after a date has been selected from the calendar. I have tried using the popupbuttonid and the click event for that button and I have tried the text box textchanged event. Nothing seems to work. Does any one know how to do this?

Thanks in advance!

Hi dowens,

You should set the property OnClientDateSelectionChanged of the CalendarExtender.

As value, you should give it a function. But the function should be without brackets or an error will occur (not sure why)

Take a look at the following example:

<%@. Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %><%@. Register Assembly="System.Web.Extensions" Namespace="System.Web.UI" TagPrefix="asp" %><%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head id="Head1" runat="server"> <title>Untitled Page</title> <script type="text/javascript"> function test() { alert('test'); } </script></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <div> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> <img id="imgCalendar1" height="20" alt="Change From Date" src="Calendar.png" /> <cc1:CalendarExtender ID="CalendarExtender1" runat="server" PopupButtonID="imgCalendar1" TargetControlID="TextBox1"OnClientDateSelectionChanged="test"> </cc1:CalendarExtender> </div> </form></body></html>

I hope this helps!
Wim

MY BAD .......

The following example call's code behind: (the one in the button's click method on the serverside).

<%@. Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %><%@. Register Assembly="System.Web.Extensions" Namespace="System.Web.UI" TagPrefix="asp" %><%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head id="Head1" runat="server"> <title>Untitled Page</title> <script type="text/javascript"> function test() { var serverButton = document.getElementById('Button1'); serverButton.click(); serverButton = null; } </script> <style type="text/css"> .hide { visibility:hidden; } </style></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <div> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> <img id="imgCalendar1" height="20" alt="Change From Date" src="Calendar.png" /> <cc1:CalendarExtender ID="CalendarExtender1" runat="server" PopupButtonID="imgCalendar1" TargetControlID="TextBox1" OnClientDateSelectionChanged="test"> </cc1:CalendarExtender> <asp:Button ID="Button1" runat="server" Text="Button" CssClass="hide" /> </div> </form></body></html>

Kind regards,
Wim

deblemewim,

I tried your suggestion and it still won't work. Here is the code for the script function and the calendar extender. If you notice the PopupButtonID is the same button that I am trying to call the click event for. I thought this might be the problem so I removed it and it still doesn't work.

function test()
{
var serverButton = document.getElementById('btnEDate');
serverButton.click();
serverButton =null;
}

<cc1:CalendarExtenderID="ceEdate"runat="server"
TargetControlID="txtEDate"
PopupButtonID="btnEDate"
CssClass="MyCalendar"
OnClientDateSelectionChanged="test">
</cc1:CalendarExtender>

Hi dowens,

Well, I don't see your whole code, but I think the your code is not working because your PopupButtonID is a Button (imagebutton, inputbutton, ordinary asp button, ...).

I don't think that is possible!!

When you look at the ajax toolkit examples, they also use either the control (textbox) itself to let the calendar popup, OR they use an image (<img id="myImage" ... ).

So that is the setup you have to go for!!

Is your calendar poping up? Is is that what isn't working?

In my example, I use an image, so the calendar gets poped up. Then, I've set the property OnClientDateSelectionChanged to trigger a javascript function whenever the date changes in the TargetControlID .

When that happens, the javascript locates an ordinary asp:button on the page (which I have hidden), and it triggers it's click event. That way I get code-behind.

If this still doesn't answer your questions, please let me know what exactly you are willing to achieve.

Kind regards,
Wim

Wim,

I think I may have found the issue. The function "test" is not finding the button. Even if I don't hide the button it still doesn't find it. I think the issue may be that I am using a masterpage. I tried your code on a test page and it works fine. The only difference I can find is the master page. I have placed the function in the <head> of the masterpage and I have also tried it on the content page. Neither one works.

Hi dowens,

Sorry for my late reply...

I did some research (since masterpages are quite new to me ...) and I found the following:http://forums.asp.net/t/1031073.aspx (xplaining about how to call javascript from a masterpage).

Now my example should work!

So, on my content page I have the following:

<%@. Page Language="VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" title="Untitled Page" %><%@. Register Assembly="System.Web.Extensions" Namespace="System.Web.UI" TagPrefix="asp" %><%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %><asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <script type="text/javascript"> function test() {var serverButton = document.getElementById("<%= Button1.ClientID%>"); serverButton.click(); serverButton = null; } </script> <br /> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> <img id="imgCalendar1" height="20" alt="Change From Date" src="Calendar.png" /> <cc1:CalendarExtender ID="CalendarExtender1" runat="server" PopupButtonID="imgCalendar1" TargetControlID="TextBox1" OnClientDateSelectionChanged="test"> </cc1:CalendarExtender> <asp:Button ID="Button1" runat="server" Text="Button" CssClass="hide" /></asp:Content>

The script is now in the content page, but I guess it should also be possible to place it somewhere else or just use a link to it (haven't tested that ..)

Hope this helps!
Wim

Wim,

It works great!! Thanks for your help.

Dale

CalendarExtender: How to count days between two selected dates

How can I calculate the days between selected dates from 2 calendarExtender controls?

thank you

zipfeli

Are you calculating client side or server side?

Clientside. Actually I want to validate the days between two textboxt dates before postback. More than 30 days should give errormessage .

Hi,

Here is a sample for your reference:

function fun(e)
 {
 var ce1 = $find("ce1");
 var start = ce1.get_selectedDate();
 if(start == null)
 return;
 var ce2 = $find("ce2");
 var end = ce2.get_selectedDate();
 if(end == null)
 return; start.setDate(start.getDate() + 30);
 if(start < end)
 alert("invalid");
 start.setDate(start.getDate() - 30);
 }
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox></div>
 <ajaxToolkit:CalendarExtender ID="CalendarExtender1" BehaviorID="ce1" runat="server" TargetControlID="TextBox1"OnClientDateSelectionChanged="fun">
 </ajaxToolkit:CalendarExtender>
   
 <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
 <ajaxToolkit:CalendarExtender ID="CalendarExtender2" BehaviorID="ce2" runat="server" TargetControlID="TextBox2" OnClientDateSelectionChanged="fun">
 </ajaxToolkit:CalendarExtender>

Hope this helps.

Wednesday, March 21, 2012

CalendarExtender with Minimum and Maximum Date that can be selected???

I have Textbox with CalendarExtender and RangeValidator for it..But I need that Minimum value for RangeValidator to be selected is Today(DateTime.Now) and Maximum value to be 1/01/2009 .How to do it,can someone write code for it...I tried but I always get some errors..ControlExtender Format is set to this ="d/MM/yyyy"

Page Load

rangevalidator1.minimumvalue = DateTime.Now.ToShortDateString

rangevalidator1.maximumvalue = "1/01/2009"

Here is the answer...and it works perfectly...

Code behing

ProtectedSub Page_Load(ByVal senderAsObject,ByVal eAs System.EventArgs)HandlesMe.Load

RangeValidator1.MinimumValue = DateTime.Now.ToString("dd-MM-yyyy")

RangeValidator1.MaximumValue ="30-12-2200"

EndSub

<formid="form1"runat="server">

<asp:ScriptManagerID="ScriptManager1"runat="server">

</asp:ScriptManager>

<ajaxToolkit:CalendarExtenderID="CalendarExtender1"runat="server"TargetControlID="TextBox1"Format="dd-MM-yyyy">

</ajaxToolkit:CalendarExtender>

<asp:TextBoxID="TextBox1"runat="server"></asp:TextBox>

<asp:RangeValidatorID="RangeValidator1"runat="server"ErrorMessage="RangeValidator"ControlToValidate="TextBox1"Type="Date"></asp:RangeValidator>

</form>

CalendarExtender question

How do I get the CalendarExtender to close when a date is selected. I tried below, but when I click a date, the textbox is populated, but the calendar is still displayed.

<asp:TextBoxID="TextboxEnd"runat="server"Text="enter end date"/>

<ajaxToolkit:CalendarExtenderID="CalendarExtenderEnd"runat="server"TargetControlID="TextBoxEnd"Animated=true/>

That's funky...we had the opposite problem: if you brought up the calendar but didn't want to select a date...just make it disappear...and clicked anywhere else on the screen, it wouldn't hide the calander until you selected a date.

We found that the new version of the Toolbox that was released recently fixes our issue...it might fix yours too...are you using the updated Toolbox controls or the older ones?

Just curious: does this happen in Firefox and IE, or just in one?

It happens in both IE and FF. I think I am using the new ones. I downloaded about a month ago. Was there a new build since then? The only way I can get the calendar to disappear is to click somewhere else on the screen.

Thanks, D'Arcy. I downloaded the September 2007 release and it's working great now.

Wednesday, March 28, 2012

Calling Clinet Function from Code Behind (Inside Ajax Update panel)

Saturday, March 24, 2012

calendarextender: popupbuttonid

CalendarExtender: How to count days between two selected dates

Wednesday, March 21, 2012

CalendarExtender with Minimum and Maximum Date that can be selected???

CalendarExtender question

CalendarExtender

Blog Archive

About Me