filter in a popup window

[Stig]

Hi

 

I have issues with a filter that i have placed in a radwindow - the dropdowns ect is put behind the window its self - this is my code:

 

<telerik:RadWindow RenderMode="Lightweight" ID="modalPopup" runat="server" Width="360px" Height="360px" Modal="true" OffsetElementID="main" Style="z-index: 100001;" Skin="Windows7">
    <ContentTemplate>
        <telerik:RadFilter ID="TableEditFilter" runat="server" FilterContainerID="rgTableEdit" ExpressionPreviewPosition="Bottom" Style="z-index: 100002;" />
    </ContentTemplate>
</telerik:RadWindow>
<script type="text/javascript">
    //<![CDATA[

    function ShowmodalPopup(sender, args) {
        $find("<%=modalPopup.ClientID%>").show();
        return false;
    }
    //]]>
</script>

and is activated by a button click in a GridTemplateColumn:

<telerik:RadButton Image-ImageUrl="~/Images/filter_16x16.png" runat="server" ID="FilterButton" Width="16" Height="16" skin="Windows7" OnClientClicked="ShowmodalPopup" AutoPostBack="false"  />

[Viktor Tachev]

Hi Stig,

Please remove the inline styles defined for both the RadWindow and RadFilter. After this the menus in the filter should be displayed as expected.

<telerik:RadWindow RenderMode="Lightweight" ID="modalPopup" runat="server" Width="360px" Height="360px" Modal="true" OffsetElementID="main"  Skin="Windows7">
    <ContentTemplate>
        <telerik:RadFilter ID="TableEditFilter" runat="server" FilterContainerID="rgTableEdit" ExpressionPreviewPosition="Bottom"   />
    </ContentTemplate>
</telerik:RadWindow>

Regards,
Viktor Tachev
Telerik

[Stig]

Yep, that did the trick - but two things...

 1) The styles was used in one of your modal popup examples... so i thought it would be better to bring along..

2) i can not get the filting to work when it resides in a window and/or update panel

<telerik:RadWindow RenderMode="Lightweight" ID="modalPopup" runat="server" Width="360px" Height="360px" Modal="true" OffsetElementID="main" Skin="Windows7">
                                <ContentTemplate>
                                    <asp:UpdatePanel runat="server" ID="filterpanel">
                                        <ContentTemplate>
                                            <telerik:RadFilter ID="TableEditFilter" runat="server" FilterContainerID="rgTableEdit" ExpressionPreviewPosition="Bottom" ShowApplyButton="false" />
                                            <telerik:RadButton runat="server" ID="ApplyFilter" Text="Apply" />
                                        </ContentTemplate>
                                    </asp:UpdatePanel>
                                </ContentTemplate>
                            </telerik:RadWindow>

if i remove the window and updatepanel tags it works as expected...

The updatepanel is needed otherwise the popwindow will close (i expect due to postbacks when you select a column)

 

[Viktor Tachev]

Hi Stig,

The styles were most likely added specifically for the demo. In most scenarios they would not be necessary.

As for your other query. In order for the filter to be applied you need to move the Apply button outside the UpdatePanel or set it as PostBackTrigger.

<telerik:RadWindow RenderMode="Lightweight" ID="modalPopup" runat="server" Width="360px" Height="360px" Modal="true" OffsetElementID="main" Skin="Windows7">
    <ContentTemplate>
        <asp:UpdatePanel runat="server" ID="filterpanel">
            <Triggers>
                <asp:PostBackTrigger ControlID="ApplyFilter" />
            </Triggers>
            <ContentTemplate>
                <telerik:RadFilter ID="TableEditFilter" runat="server" FilterContainerID="rgTableEdit" ExpressionPreviewPosition="Bottom" ShowApplyButton="false" />
                <telerik:RadButton runat="server" ID="ApplyFilter" Text="Apply" OnClick="ApplyFilter_Click" />
            </ContentTemplate>
        </asp:UpdatePanel>

    </ContentTemplate>
</telerik:RadWindow>

Then you should handle the Click event of the button and fire the filter command manually in order for the selected filter to be applied.

protected void ApplyFilter_Click(object sender, EventArgs e)
{
    TableEditFilter.FireApplyCommand();
}

Regards,
Viktor Tachev
Telerik