Grid GridDateTimeColumn filter

2 posts, 1 answers
  1. SDI
    SDI avatar
    107 posts
    Member since:
    Nov 2011

    Posted 18 Sep 2013 Link to this post

    We have a grid in the RadCombo and we are using a couple GridDateTimeColumns with filtering enabled. When the user clicks on the Date control to pull up the pop-up its behind the Grid and they can not select a date to filter on. Is there a z-order that needs set here?


    <telerik:RadComboBox runat="server" ID="RadComboSubEvents" CheckBoxes="true" Width="98%">
            <telerik:RadGrid runat="server" ID="RadGridSubEvents" OnNeedDataSource="RadGridSubEvents_NeedDataSource" AllowMultiRowSelection="true">
                <MasterTableView NoMasterRecordsText="There are not any events created" AutoGenerateColumns="False" DataKeyNames="EventSubId, Name, StartDate, EndDate"
                    Width="100%" ClientDataKeyNames="EventSubId, Name, StartDate, EndDate" TableLayout="Fixed" AllowFilteringByColumn="true" >
                        <telerik:GridClientSelectColumn UniqueName="SelectColumn">
                            <HeaderStyle Width="25px" />
                            <ItemStyle Width="25px" />
                        <telerik:GridBoundColumn HeaderText="EventSubId" DataField="EventSubId" UniqueName="EventSubId" Display="false" />
                        <telerik:GridBoundColumn HeaderText="Name" DataField="Name" UniqueName="Name" FilterControlWidth="250px">
                            <HeaderStyle Width="300px" />
                            <ItemStyle Width="300px" Wrap="true" />                                                                       
                        <telerik:GridDateTimeColumn HeaderText="Start Date" DataField="StartDate" UniqueName="StartDate" DataFormatString="{0:M/d/yyyy}" DataType="System.DateTime">
                            <HeaderStyle Width="75px" HorizontalAlign="Right" />
                            <ItemStyle Width="75px" Wrap="false" HorizontalAlign="Right" />
                        <telerik:GridDateTimeColumn HeaderText="End Date" DataField="EndDate" UniqueName="EndDate" DataFormatString="{0:M/d/yyyy}" DataType="System.DateTime" >
                            <HeaderStyle Width="75px" HorizontalAlign="Right" />
                            <ItemStyle Width="75px" Wrap="false" HorizontalAlign="Right" />
                    <Selecting AllowRowSelect="true" UseClientSelectColumnOnly="true" />
            <telerik:RadComboBoxItem runat="server" Text=" "></telerik:RadComboBoxItem>
  2. Answer
    Boyan Dimitrov
    Boyan Dimitrov avatar
    2053 posts

    Posted 23 Sep 2013 Link to this post


    I would like to clarify that this behavior is due to the fact that the RadComboBox drop down area has a z-index value. Therefore you have to apply higher value of your pop-up calendar in order to appear on the top of the drop down area. Please use the following styles to avoid that problem.
    <style type="text/css">
            .RadCalendarPopup {
                z-index: 7000 !important;

    Boyan Dimitrov
    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.
Back to Top