This is a migrated thread and some comments may be shown as answers.

onPopupOpening of RadDatePicker, Calendar does not get pop up.

9 Answers 504 Views

Calendar

This is a migrated thread and some comments may be shown as answers.

kamini asked on 19 Aug 2013, 12:23 PM

Hi

I have used OnPupupOpening of RadDatePicker. It's working proper but Calendar does not get pop up.

My code is

<telerik:RadDatePicker ID="FromDatePicker" runat="server" Culture="English (United States)">

<ClientEvents OnPopupOpening="OnPopupOpening" ></ClientEvents>

<dateinput >

</dateinput>

<calendar showrowheaders="False"

usecolumnheadersasselectors="False" userowheadersasselectors="False"

viewselectortext="x">

</calendar>

<datepopupbutton />

</telerik:RadDatePicker

>

<script language="javascript" type="text/javascript">

function OnPopupOpening(sender, args) {

    	GetValue();

    }

</script>

here, GetValue() is called properly but i am not able see calendar.

Thanks
Kamini

9 Answers, 1 is accepted

answered on 21 Aug 2013, 06:37 AM

Hi Princy

Thanks for your reply but unfortunately, your given solution does not work.

Actually I have used DatePicker inside RadGrid in Header Template for filteration purpose.

My Code is:

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

protected override void OnLoad(EventArgs e)

    {

        base.OnLoad(e);

    	AT.Common.UserControls.Utilities.ClientResourceManager.IncludeScriptFile(

    		this.Page,

    		"/DesktopModules/test/test.Controls/Resources/test.filter.js",

    		"/DesktopModules/test/test.Controls/Resources/test.filter.js");

    }

<

telerik:RadGrid AllowPaging="True" AllowSorting="True" AutoGenerateColumns="False" EnableEmbeddedSkins="False" EnableViewState="True" ID="radGrid1" runat="server">

<MasterTableView AllowFilteringByColumn="False" NoMasterRecordsText="No Order found" DataKeyNames="UserID">

<Columns>

<telerik:GridTemplateColumn DataField="RegDate" UniqueName="RegDate">

<HeaderTemplate>

<div class="FilterMenu">

Reg Date

<table width="100%">

<tr>

<td style="width: 25%;">

Between

</td>

<td>

<telerik:RadDatePicker ID="FromDatePicker" runat="server" Culture="English (United States)">

<ClientEvents OnPopupOpening="OnPopupOpening"></ClientEvents>

<dateinput>

</dateinput>

<calendar showrowheaders="False"

usecolumnheadersasselectors="False" userowheadersasselectors="False"

viewselectortext="x">

</calendar>

<datepopupbutton />

</telerik:RadDatePicker>

</td>

</tr>

<tr>

<td>

and

</td>

<td>

<telerik:RadDatePicker ID="ToDatePicker" runat="server" Culture="English (United States)">

<ClientEvents OnPopupOpening="OnPopupOpening"></ClientEvents>

<dateinput >

</dateinput>

<calendar showrowheaders="False" secolumnheadersasselectors="False" userowheadersasselectors="False" viewselectortext="x">

</calendar>

<datepopupbutton />

</telerik:RadDatePicker>

</td>

</tr>

</table

</HeaderTemplate

<ItemTemplate

<%# DataBinder.Eval(Container.DataItem,"RegDate","{0:d}") %>
</ItemTemplate

</Columns

</

MasterTableView>

</telerik:RadGrid

<script language="javascript" type="text/javascript">

function OnPopupOpening(sender, args) {

FilterMenuFun();

}

</script>

Here, FilterMenuFun() is in the test.filter.js and because of this function, Calendar does not get pop up. If I remove FilterMenuFun(),
It works fine.

Thanks
Kamini

answered on 21 Aug 2013, 08:13 AM

Hi Princy

I have updated my above post. Please have a look.

Also look at the below code which you have asked to provide.

function FilterMenuFun() {

var $this = jQuery(this);

var $gridWrapper = $this.parents(".RadGrid_test");

var $dialog = jQuery(".test-FilterDropDown[data-item='"+ $this.attr("data-item") +"']");

$this.addClass("test-ActiveMenu");

$dialog.css({left: $this.offset().left + "px", top: $this.offset().top + $this.height() + "px", display: "block", visibilty: "hidden" });

if( ($dialog.width() + $dialog.offset().left) > ($gridWrapper.width() + $gridWrapper.offset().left )){

$dialog.css({left: $this.offset().left - $dialog.width() + "px" });

}

$dialog.css({display: "none", visibilty: "visible" });

$dialog.slideDown("fast");

$dialog.hoverIntent({

sensitivity: 2,

interval: 200,

timeout: 500,

over: function(){},

out: function(){

jQuery(this).slideUp("fast")

$this.removeClass("test-ActiveMenu");

}

});

}

Thanks
Kamini