onPopupOpening of RadDatePicker, Calendar does not get pop up.

10 posts, 0 answers
  1. kamini
    kamini avatar
    32 posts
    Member since:
    Jun 2010

    Posted 19 Aug 2013 Link to this post

    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
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 20 Aug 2013 Link to this post

    Hi Kamini,

    Such an issue can happen if the RadDatePicker is placed inside an Ajax Modal Popup, a RadAjaxPanel or a RadWindow. One possible solution is to set set the ZIndex property of the RadDatePicker with a higher value as shown in this thread. if this does not help, please get back to us with the complete code.

    Thanks,
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. kamini
    kamini avatar
    32 posts
    Member since:
    Jun 2010

    Posted 21 Aug 2013 Link to this post

    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

  5. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 21 Aug 2013 Link to this post

    Hi Kamini,

    Since you have not provided the code inside the function 'FilterMenuFun()', I couldn't replicate the issue at my end.
    One suggestion is to use FilterTemplate of the GridTemplateColumn of RadGrid instead of the HeaderTemplate. Please take a look into this help documentation and provide the code for more help.

    Thanks,
    Princy.
  6. kamini
    kamini avatar
    32 posts
    Member since:
    Jun 2010

    Posted 21 Aug 2013 Link to this post

    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
  7. Venelin
    Admin
    Venelin avatar
    352 posts

    Posted 26 Aug 2013 Link to this post

    Hi Kamini,

    The popup is not showing because of a JavaScript error that says: "TypeError: jQuery is not a function". In order to properly use jQuery in your project you have to use one of the following approaches listed here: Using jQuery. Please go through this help article which gives very detailed information and will help you avoid such difficulties in future.

    Regards,
    Venelin
    Telerik
    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 the blog feed now.
  8. Frank
    Frank avatar
    4 posts
    Member since:
    Sep 2015

    Posted 02 May Link to this post

    Would somebody please tell me how to go about posting a question to this forum? I find plenty of help for searching a forum, but no instructions or links for posting a question. Thanks.
  9. Viktor Tachev
    Admin
    Viktor Tachev avatar
    1488 posts

    Posted 04 May Link to this post

    Hi Frank,

    In order to submit a new thread you need to enter the section regarding the control you have queries about. Above the posted threads you will see a New thread button.



    Regards,
    Viktor Tachev
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  10. Frank
    Frank avatar
    4 posts
    Member since:
    Sep 2015

    Posted 11 May in reply to Viktor Tachev Link to this post

    Thank you Viktor. I just submitted my first post, titled "Additional X axis labels." I don't find it when I search for it, but maybe it has to be approved before it is searchable.

    frank

  11. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 12 May Link to this post

    Hi Frank,

    Here is the link to the public forum post:

    http://www.telerik.com/forums/additional-x-axis-labels

    Regards,
    Maria Ilieva
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017