Hi i am using webdatepicker of infragistics and i open it with button click event,but i wnt to reduce its size also i want to open it (calander)in top direction but i was unable to do that.Kindly help and provide a code if possible.I will appreciate if code with image button is given .
Hi,
There are various public methods on client for editors. You may look at docs or at methods of datePicker/dateChooser objects in debugger. Below is examples to show calendar of dateChooser and datePicker on external events.
<script type="text/javascript"> function dc() { var dc = ig$('WebDateChooser1'); if(dc) dc.setDropDownVisible(true); } function dp() { var dp = $find('WebDatePicker1'); if(dp) dp.setCalendarOpened(true); }</script><input type="button" value="show calendar in chooser" onclick="dc()" /><input type="button" value="show calendar in picker" onclick="dp()" /><igsch:WebDateChooser ID="WebDateChooser1" runat="server"></igsch:WebDateChooser><ig:WebDatePicker ID="WebDatePicker1" runat="server"></ig:WebDatePicker>
Changing drop-down location of calendar is not supported. If there is not enough space below datePicker, then calendar should appear above field (older versions of WebDatePicker in some specific layouts of applications might have issues with that, but latest version should work better).
WebDatePicker raises CalendarOpened event, so, application may process that event and change position., however, it should disable slide animation. Similar codes application may use only on its own risk. Before swap, application also may check if caledar-element is already above field-element.
<script type="text/javascript"> function WebDatePicker1_CalendarOpened(sender, eventArgs) { var cal = sender.get_calendar(); var elem = cal.get_element(); var top = elem.style.marginTop; top = top ? parseInt(top, 10) : 0; elem.style.marginTop = (top - elem.offsetHeight - sender.get_element().offsetHeight) + 'px'; }</script><ig:WebDatePicker ID="WebDatePicker1" runat="server"> <calendaranimation slideopenduration="0" /> <clientsideevents calendaropened="WebDatePicker1_CalendarOpened" /></ig:WebDatePicker>