Parameterized lightbox.show() functions - how to do it

3 posts, 1 answers
  1. Tomica
    Tomica avatar
    147 posts
    Member since:
    Apr 2008

    Posted 11 Mar 2014 Link to this post

    I have modified a copy of the LightBox demo. I have three LightBox controls on the page, each includes an item template with  RadPageView set to a specific ContentUrl value. The actual URLs are identical, except for one parameter, which in this case are "about", "help" and "user".

    I am not sufficiently familiar with client-side code, but I am pretty sure that the click events for the RadButtons could be modified to pass a parameter so that the URL parameter on RadPageView could be set, thus eliminating the need for three distinct LightBoxes. (because I might need a dozen more variations)

    <script type="text/javascript">
        function OpenAboutLightBox() {
            var lightBox = $find('<%= AboutLightBox.ClientID %>');
            lightBox.show();
        }
        function OpenHelpLightBox() {
            var lightBox = $find('<%= HelpLightBox.ClientID %>');
            lightBox.show();
        }
     
        function OpenUserLightBox() {
            var lightBox = $find('<%= UserLightBox.ClientID%>');
                        lightBox.show();
                    }
     
    </script>

    <telerik:RadLightBox ID="AboutLightBox" runat="server" Width="900px" Modal="True" PreserveCurrentItemTemplates="False" ShowLoadingPanel="False" ViewStateMode="Disabled" Height="460px">
        <ClientSettings>
            <AnimationSettings NextAnimation="CollapsingHorizontalStripes" PrevAnimation="VerticalResize" ShowAnimation="Resize">
            </AnimationSettings>
        </ClientSettings>
            <Items>
                <telerik:RadLightBoxItem>
                    <DescriptionTemplate>
                        <div style="visibility:hidden;"></div>
                    </DescriptionTemplate>
                    <ItemTemplate>
                        <div style="padding: 0px; margin: 0px; overflow: hidden; position: relative;">
                            <telerik:RadMultiPage ID="RadMultiPage_About" runat="server" SelectedIndex="0">
                            <telerik:RadPageView ID="RadPageView_About" runat="server" ContentUrl="minimal_about.aspx"  Height="460" Width="900">RadPageView</telerik:RadPageView>
                            </telerik:RadMultiPage>
                        </div>
                    </ItemTemplate>
                </telerik:RadLightBoxItem>
            </Items>
    </telerik:RadLightBox>
  2. Answer
    Kostadin
    Admin
    Kostadin avatar
    1709 posts

    Posted 14 Mar 2014 Link to this post

    Hi Tomica,

    Thank you for contacting us.

    A possible solution is to create three TemplateItems and when opening the LightBox to display the template item which response to the button click. I prepared a sample where I demonstrates this approach and attached it to this thread.

    Regards,
    Kostadin
    Telerik
     

    DevCraft Q1'14 is here! Watch the online conference to see how this release solves your top-5 .NET challenges. Watch on demand now.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Tomica
    Tomica avatar
    147 posts
    Member since:
    Apr 2008

    Posted 18 Mar 2014 in reply to Kostadin Link to this post

    Thanks, I now understand the process.
Back to Top