ajax calenderextender display problem

hi friends,
                 am using asp.net 2008 , already added design page at  ajax calenderextender control but i got runtime its display behind the other controls. how to solve this control asp.net 2008. and how to move controls design page? ( but asp.net 2005 we had changed  layout option in relative,absolute, if give absolute we can move any place)  how to solve this both problem ?

declare the style class having  z-index: 1 like

.calenderExtStyle
{
 z-index: 1
}

use this style in the CssClass of calender extender as shown
<ajaxToolkit:Calendar runat="server"
    TargetControlID="TextBox1"
    CssClass="calenderExtStyle"
    Format="MMMM d, yyyy"
    PopupButtonID="Button1"/>

      hi friend,

                    its also not working proberly , the calenderextender same position and  behind all .
please any other idea.

                       heartly thanks to u buddy

The other approach would be to
Wrap the TragetControl and the calendar extender into a DIV tag

simply add the below css classes onto your page

.ajax__calendar {
    position: relative;
    left: 0px !important;
    top: 0px !important;
    visibility: visible; display: block;
}
.ajax__calendar iframe
{
    left: 0px !important;
    top: 0px !important;
}

Make sure that the CssClass property of the extender is removed. Don't specify anything.

try with this it will work




<asp:TextBox ID="TextBox1" runat="server" ontextchanged="TextBox1_TextChanged"></asp:TextBox>

        <cc1:CalendarExtender ID="TextBox1_CalendarExtender" runat="server" Enabled="True" TargetControlID="TextBox1" PopupButtonID="ImageButton1"></cc1:CalendarExtender>
        <asp:ImageButton ID="ImageButton1" runat="server" />
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
       

Regards,
Chaithanya

Hi try this will help you

paste this in Source


<div>
<asp:TextBox ID="TextBox1" runat="server" ontextchanged="TextBox1_TextChanged"></asp:TextBox>

        <cc1:CalendarExtender ID="TextBox1_CalendarExtender" runat="server" Enabled="True" TargetControlID="TextBox1" PopupButtonID="ImageButton1"></cc1:CalendarExtender>
        <asp:ImageButton ID="ImageButton1" runat="server" />
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
       
</div>

run the website


once the u see the output


click on Image button it will show calender

click on the date that date will appear in textbox


Regards,
Chaithanya

<%

@ Page Language="VB" AutoEventWireup="false" CodeFile="assetmasterwprogress.aspx.vb" Inherits="assetmasterwprogress" %>

 

<%

@ 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 runat="server">

 

 

<title>Storm Water</title>

 

 

<link rel="Stylesheet" type="text/css" href="Css/StyleSheet.css" />

 

 

<style type ="text/css" runat ="server" >

 

 

.ajax__calendar

 

{

position

 

: relative;

 

background-color

 

:Green;

 

left

 

: 0px !important;

 

top

 

: 0px !important;

 

visibility

 

: visible; display:table;

 

}

.ajax__calendar

 

iframe

 

{

left

 

: 0px !important;

 

top

 

: 0px !important;

 

}

 

</style>

 

</

 

head>

 

<

 

body>

 

 

<form id="form1" runat="server" style="z-index: 123"

 

 

submitdisabledcontrols="True">

 

 

<asp:LinkButton ID="LinkButton2" runat="server" Font-Bold="True" ForeColor="DarkGreen"

 

 

OnClientClick=" return confirm(' You have not specified file');" Style="z-index: 101; left: 776px; position: absolute; top: 15px" Width="59px">Upload </asp:LinkButton>

 

 

 

<asp:Label ID="Label1" runat="server" Font-Bold="True" ForeColor="DarkSlateGray"

 

 

Style="z-index: 102; left: -1px; position: absolute; top: 5px" Text="Works In Progress(New Asset) - Schedule No. 11"

 

 

Width="251px" Font-Size="11pt"></asp:Label>

 

 

<asp:ScriptManager ID="ScriptManager1" runat="server">

 

 

</asp:ScriptManager>

 

 

<div>

 

 

<cc1:CalendarExtender ID="CalendarExtender1" runat="server"

 

 

TargetControlID ="assetdate" PopupButtonID ="cal0" CssClass ="ajax__calendar"

 

 

Format="dd/MM/yyyy">

 

 

</cc1:CalendarExtender>   //          here am used this cssclass

 

 

</div>

 

 

 

<cc1:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender1" runat="server" WatermarkText ="DD/MM/YYYY" TargetControlID ="assetdate">

 

 

</cc1:TextBoxWatermarkExtender>

 

 

 

 

<asp:LinkButton ID="LinkButton1" runat="server" Style="z-index: 103; left: 692px;

 

 

position: absolute; top: 44px" ForeColor="DarkGreen" Font-Bold="True" Width="13px" Visible="False">Report</asp:LinkButton>

 

</

 

body>

 

</

 

html>

 

hi friend,

            the date wil be stored on textbox . its working fine but i need front of other controls, ( calender appears on behind the other controls ex, if i have used  textboxes here in  calender displayed back) i need to show the calender front on controls.

As I said in my previous post remove  CssClass ="ajax__calendar" from the extender.