Welcome Guest Search | Active Topics | Sign In | Register

DatePicker, Image Position Options
Kyro
Posted: Tuesday, October 13, 2009 7:20:50 AM
Rank: Newbie
Groups: Member

Joined: 10/13/2009
Posts: 2
Hello, I am vastly impressed with your controls and have only just begun to scratch the surface of them.

However I am having some issues with the DatePicker.
I have set up a Skin (based nearly Identical to the Vista Design in the Demo's), however the PopupImage (that you click) is a long way away from the Textbox.
Is there any way to get this to be right next to the Textbox ?
(see image below for what its showing like in Google Chrome).



My Skin file is:
Code: XML
<eo:DatePicker SkinID="Default" runat="server" TitleRightArrowImageUrl="DefaultSubMenuIcon" TitleLeftArrowImageUrl="DefaultSubMenuIconRTL"
                            DayHeaderFormat="Short" OtherMonthDayVisible="True" DayCellWidth="15" DayCellHeight="15" TitleFormat="MMMM, yyyy" Width="100px" PopupDownImageUrl="../../App_Themes/Core/img/action/calendar.png" PopupImageUrl="../../App_Themes/Core/img/action/calendar.png" PopupHoverImageUrl="../../App_Themes/Core/img/action/calendar.png" SwapStyle="Linear">
<SelectedDayStyle CssText="background-image:url('00040403');color:Brown;"/>
<TitleArrowStyle CssText="cursor: hand" />

<DisabledDayStyle CssText="color: gray" />
<TitleStyle CssText="font-family:Verdana;font-size:8.75pt;padding-bottom:5px;padding-left:5px;padding-right:5px;padding-top:5px;">
</TitleStyle>
<CalendarStyle CssText="background-color:white;border-bottom-color:Silver;border-bottom-style:solid;border-bottom-width:1px;border-left-color:Silver;border-left-style:solid;border-left-width:1px;border-right-color:Silver;border-right-style:solid;border-right-width:1px;border-top-color:Silver;border-top-style:solid;border-top-width:1px;color:#2C0B1E;padding-bottom:5px;padding-left:5px;padding-right:5px;padding-top:5px;"/>
<DayHoverStyle CssText="background-image:url('00040402');color:#1c7cdc;"/>
<MonthStyle CssText="cursor:hand;font-family:Verdana;font-size:8pt;margin-bottom:0px;margin-left:4px;margin-right:4px;margin-top:0px;"/>
<DayHeaderStyle CssText="border-bottom: #f5f5f5 1px solid"/>
</eo:DatePicker>



Also the Popup for the picker is a lot larger than what is in the Vista Design demo.

Is there any specific code I can implement to force the popup to be a certain width/height?

Thanks
eo_support
Posted: Tuesday, October 13, 2009 7:33:04 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,194
Hi,

Please Check your CSS files. It appears that you have some global rules that have paddings on td element. Because the DatePicker uses td element, so the paddings got applied automatically, this is not desired. As a test, you can try to remove all your CSS files, or test your DatePicker in an empty page to see if it is the problem.

To remove "/" in the textbox, set the DatePicker's PickerFormat to "MMddyyyy". You can even customize it to include only one part, for example, "MM". Please see here for more details:

http://doc.essentialobjects.com/library/1/eo.web.datepicker.pickerformat.aspx

Thanks
Kyro
Posted: Tuesday, October 13, 2009 5:36:30 PM
Rank: Newbie
Groups: Member

Joined: 10/13/2009
Posts: 2
Are the DatePicker's table elements able to be specifically set with CSS back to their default?

sort of like
Code: CSS
datepicker.td{
}

?
eo_support
Posted: Tuesday, October 13, 2009 5:45:38 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,194
Hi,

In theory you could but specifying an empty class does not reset it to default because by not specifying anything, you are inheriting everything from the chain. So in your case your datepicker.td will have exactly the same style as td.

In order to reset any property, you have to explicitly override it. So for example if you have set padding to 10 in your global td rule and you want to "reset" it, you have to explicitly have "padding:0" in your new rule. This is tedious, not to mention that every time you modify your global td rule, you will have to modify these "overriding" rules as well. Thus the most reliable way is always to restrict the scope of your global rules.

Thanks


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.