Showing posts with label div. Show all posts
Showing posts with label div. Show all posts

Saturday, March 24, 2012

Calender control positioning problem

I have got two issues with calender control

1)I have body scroll="no" and div's overflow to auto(as i have menu in top div locked and content page in other div) When i use calender control the position of popup is offset to the targetcontrolid i.e it is not docked below targetcontrol id. TargetControl is at the bottom of div so user has to scroll to reach that control. Is there any way to render the popup aligned with targetcontrol as it is done when body scroll="yes". I have also tried with body's style="overflow-y:hidden" and got same offset issue.

2) In addition to above scenario, if i have dropdownlist below target control, than calender control seems to be hidden partially. Is there any way to set z-index so that calender control will always be rendered on top of dropdownlist.

It's the divs that are controling where the calendar is position. Did you play with the absolute value? That will let you add the calendar wherever you want in the page, the only control that has problems positioning with divs is the dropdown in IE6. Do you want me to send you some div code?
sure you can send me the code...i will highly appreciate that..

Wednesday, March 21, 2012

CalendarExtender not maintaining position in gridview within scrollable div

Hi,

I posted a few months ago on a similar problem with the popupextenderhttp://forums.asp.net/t/1160340.aspx

I am now trying to do the same thing with a calendarextender however my solution in the above post does not work. Does anyone know how to get the calendarextender to appear correctly when attached to a textbox in an edititemtemplate in a gridview surrounded by a scrollable div?

I have tried to attach the same principles in the above post to the ClientOnShown event but to no avail.

Any help greatly appreciated.

Thanks

Craig

Hi Sonnyikea,

Here is the sample and I have tested on IE7 and Firefox. Please compare it with yours.

<%@. Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
<script runat="server">

</script
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div id="div-datagrid" style="width: 100%; height: 100px; overflow: auto;" align="center">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="EmployeeID"
DataSourceID="SqlDataSource1" AllowPaging="True" >
<Columns>
<asp:BoundField DataField="EmployeeID" HeaderText="EmployeeID" InsertVisible="False"
ReadOnly="True" SortExpression="EmployeeID" />
<asp:BoundField DataField="LastName" HeaderText="LastName" SortExpression="LastName" />
<asp:BoundField DataField="FirstName" HeaderText="FirstName" SortExpression="FirstName" />
<asp:BoundField DataField="Title" HeaderText="Title" SortExpression="Title" />
<asp:TemplateField>
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<ajaxToolkit:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="TextBox1" OnClientShown="onCEShown">
</ajaxToolkit:CalendarExtender>
</EditItemTemplate>
</asp:TemplateField>
<asp:CommandField ShowEditButton="True" />
</Columns>
</asp:GridView><asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NORTHWNDConnectionString%>"
SelectCommand="SELECT [EmployeeID], [LastName], [FirstName], [Title] FROM [Employees]"></asp:SqlDataSource>
</div>
<script type="text/javascript" language="javascript">
function onCEShown(){
alert(1);
}
</script>
</form>
</body>
</html>
If it doesn't work , please feel free to let me know with a tiny and workable sample. Thanks

Best regards,

Jonathan


Thanks Jonathan, I got it working