Hello team,
I have two RadDatePicker that I'm showing next to eachother to pick a from and upon date.
It displays always fine in Chrome, FireFox, IE8, IE9, except in IE9 Compatibility Mode (which has to be supported for our clients)
In IE9 Compatibility Mode the boxes are shown like this:
[RadDatePicker1 here]
until
[RadDatePicker2 here]
While in any other browser and IE9 non Comp.Mode it shown like this (as I want):
[RadDatePicker1 here] until [RadDatePicker2 here]
(see attached screenshot for clarification)
I tried wrapping all controls in a div with white-space:nowrap; and/or display:inline; but nothing seems to work.
However, when I remove the following line, it works, but removing this line is not an option.
Do you have any suggestions to make this work? Using Q3 2011 SP1 and Asp.Net 3.5
Thanks in advance!
Regards,
Jasper
My code:
I have two RadDatePicker that I'm showing next to eachother to pick a from and upon date.
It displays always fine in Chrome, FireFox, IE8, IE9, except in IE9 Compatibility Mode (which has to be supported for our clients)
In IE9 Compatibility Mode the boxes are shown like this:
[RadDatePicker1 here]
until
[RadDatePicker2 here]
While in any other browser and IE9 non Comp.Mode it shown like this (as I want):
[RadDatePicker1 here] until [RadDatePicker2 here]
(see attached screenshot for clarification)
I tried wrapping all controls in a div with white-space:nowrap; and/or display:inline; but nothing seems to work.
However, when I remove the following line, it works, but removing this line is not an option.
<
meta
http-equiv
=
"X-UA-Compatible"
content
=
"IE=edge,chrome=1"
/>
Do you have any suggestions to make this work? Using Q3 2011 SP1 and Asp.Net 3.5
Thanks in advance!
Regards,
Jasper
My code:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Test2.aspx.cs" Inherits="Tests_Test2" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html>
<
html
xmlns
=
"http://www.w3.org/1999/xhtml"
>
<
head
runat
=
"server"
>
<
meta
http-equiv
=
"X-UA-Compatible"
content
=
"IE=edge,chrome=1"
/>
<
title
></
title
>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
asp:ScriptManager
EnableScriptGlobalization
=
"true"
runat
=
"server"
ID
=
"scriptManager"
EnablePartialRendering
=
"True"
/>
<
div
>
<
telerik:RadDatePicker
ID
=
"RadDatePicker1"
runat
=
"server"
MinDate
=
"1900-01-01"
MaxDate
=
"2099-12-31"
Width
=
"110px"
>
<
DateInput
ID
=
"DateInput1"
runat
=
"server"
DateFormat
=
"dd-MM-yyyy"
DisplayDateFormat
=
"dd-MM-yyyy"
></
DateInput
>
<
DatePopupButton
ImageUrl
=
"~/images/calendar.png"
HoverImageUrl
=
"~/images/calendar.png"
/>
</
telerik:RadDatePicker
>
until
<
telerik:RadDatePicker
ID
=
"RadDatePicker2"
runat
=
"server"
MinDate
=
"1900-01-01"
MaxDate
=
"2099-12-31"
Width
=
"110px"
>
<
DateInput
ID
=
"DateInput2"
runat
=
"server"
DateFormat
=
"dd-MM-yyyy"
DisplayDateFormat
=
"dd-MM-yyyy"
></
DateInput
>
<
DatePopupButton
ImageUrl
=
"~/images/calendar.png"
HoverImageUrl
=
"~/images/calendar.png"
/>
</
telerik:RadDatePicker
>
</
div
>
</
form
>
</
body
>
</
html
>
12 Answers, 1 is accepted
0
Hello,
I am afraid the issue you are facing is not replicable on our side. You can take a look at this screenshot for reference.
Please let me know if you think I have missed something important.
Additionally, in case the issue persists could you possibly send a small running project that we can use to reproduce the case.
Alternatively a live URL will help us as well. This will help us provide better support.
Regards,
Galin
the Telerik team
I am afraid the issue you are facing is not replicable on our side. You can take a look at this screenshot for reference.
Please let me know if you think I have missed something important.
Additionally, in case the issue persists could you possibly send a small running project that we can use to reproduce the case.
Alternatively a live URL will help us as well. This will help us provide better support.
Regards,
Galin
the Telerik team
Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
0

Nick
Top achievements
Rank 1
answered on 13 Feb 2012, 11:51 AM
Hello Galin,
I noticed in your screenshot that you're running IE9 in Document Mode: IE7 standards. If you run the page in IE9 standards you should be able to reproduce it.
Also, I have a sample project in which you can also reproduce it, but I can only attach image files and our support license expired a month ago, so I can't send it to you.
Steps to reproduce:
1. Start the project in IE9 compatibiliy view
2. The datepickers are as wide as the screen, and they will always appear underneath eachother
3. Press F12 to open the analyser
4. Switch to IE9 (NOT the comp.view)
5. Everything looks OK now
6. Also, in comp. view there's an extra white space underneath the datepickers (see also screenshot)
Note: The version of Telerik I'm using is: 2011.3.1305.35
I hope you can help me!
Thanks,
Jasper
I noticed in your screenshot that you're running IE9 in Document Mode: IE7 standards. If you run the page in IE9 standards you should be able to reproduce it.
Also, I have a sample project in which you can also reproduce it, but I can only attach image files and our support license expired a month ago, so I can't send it to you.
Steps to reproduce:
1. Start the project in IE9 compatibiliy view
2. The datepickers are as wide as the screen, and they will always appear underneath eachother
3. Press F12 to open the analyser
4. Switch to IE9 (NOT the comp.view)
5. Everything looks OK now
6. Also, in comp. view there's an extra white space underneath the datepickers (see also screenshot)
Note: The version of Telerik I'm using is: 2011.3.1305.35
I hope you can help me!
Thanks,
Jasper
0
Accepted
Hello,
Thank you for sending more information.
All the best,
Galin
the Telerik team
Thank you for sending more information.
The issue seems to be a browser bug. However, I have forwarded it to our developers. They will investigate the problem further.
In the meantime, could you try to place the following CSS in the page header tag as a workaround
<!--[if IE]>
<
style
type
=
"text/css"
>
.RadPicker{display: inline-block !important;}
* + html .RadPicker{display: inline !important;}
* html .RadPicker{display: inline !important;}
</
style
>
<![endif]-->
I hope this helps.
All the best,
Galin
the Telerik team
Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
0

Nick
Top achievements
Rank 1
answered on 17 Feb 2012, 10:53 AM
Hello Galin,
Thanks for the workaround! It works.
Regards,
Jasper
Thanks for the workaround! It works.
Regards,
Jasper
0

Amjad
Top achievements
Rank 1
answered on 03 Jul 2012, 03:47 PM
Worked fine for me too thanks
can you please explain to use whats the means of the style you just posted (just for knowledge)
can you please explain to use whats the means of the style you just posted (just for knowledge)
0

Sam Vanhoutte
Top achievements
Rank 1
answered on 17 Jul 2012, 08:25 AM
also working here!
thanks a lot
thanks a lot
0

Bill Dumansky
Top achievements
Rank 1
answered on 18 Jul 2012, 09:20 PM
It works but this approach also disables .set_visible(false) client side method
0
Hi Bill,
I agree, the provided workaround breaks the set_visible method. Therefore, I can suggest you to hide the parent element of the RadPicker, e.g.
I hope this helps.
Regards,
Galin
the Telerik team
I agree, the provided workaround breaks the set_visible method. Therefore, I can suggest you to hide the parent element of the RadPicker, e.g.
<%@ Page Language="C#" AutoEventWireup="true" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!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
>TestPage</
title
>
<
script
type
=
"text/javascript"
>
function hidePicker() {
$get("RadDatePickerWrapper").style.display = "none";
}
function showPicker() {
$get("RadDatePickerWrapper").style.display = "";
}
</
script
>
<!--[if IE]>
<
style
type
=
"text/css"
>
.RadPicker{display: inline-block !important;}
* + html .RadPicker{display: inline !important;}
* html .RadPicker{display: inline !important;}
</
style
>
<![endif]-->
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
telerik:RadScriptManager
ID
=
"scriptManager"
runat
=
"server"
>
</
telerik:RadScriptManager
>
<
telerik:RadButton
ID
=
"Button1"
runat
=
"server"
OnClientClicked
=
"hidePicker"
Text
=
"Hide picker"
AutoPostBack
=
"false"
/>
<
telerik:RadButton
ID
=
"Button2"
runat
=
"server"
OnClientClicked
=
"showPicker"
Text
=
"Show picker"
AutoPostBack
=
"false"
/>
<
br
/>
<
br
/>
<
div
id
=
"RadDatePickerWrapper"
>
<
telerik:RadDatePicker
ID
=
"RadDatePicker1"
runat
=
"server"
Width
=
"110px"
>
</
telerik:RadDatePicker
>
</
div
>
</
form
>
</
body
>
</
html
>
I hope this helps.
Regards,
Galin
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0

OMAIR
Top achievements
Rank 1
answered on 06 Nov 2012, 09:50 AM
Thanx its working for me.....!
Love u
Love u
0
Hello,
The issue is fixed and today a new internal build, which includes this fix, is uploaded. Could you please upgrade to it and let me know how it goes?
Also, you can waiting for the next stable version - SP1, which will be released in the beginning of December.
Kind regards,
Galin
the Telerik team
The issue is fixed and today a new internal build, which includes this fix, is uploaded. Could you please upgrade to it and let me know how it goes?
Also, you can waiting for the next stable version - SP1, which will be released in the beginning of December.
Kind regards,
Galin
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0

Amrita
Top achievements
Rank 1
answered on 31 Oct 2014, 06:41 AM
I am still facing this issue.
I am on 2013.2.717.45 build
I am on 2013.2.717.45 build
0
Hi Amrita,
I tested the issue with the mentioned version and it works as expected. Therefore could you please provide more information about the problems you are facing?
Thank you for the cooperation.
Regards,
Galin
Telerik
I tested the issue with the mentioned version and it works as expected. Therefore could you please provide more information about the problems you are facing?
Thank you for the cooperation.
Regards,
Galin
Telerik
Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.