ItemTemplate demo

2 posts, 0 answers
  1. Fit2Page
    Fit2Page avatar
    436 posts
    Member since:
    Feb 2007

    Posted 09 Jan Link to this post

    Hi,

    Would it be possible to page in the LightBox without refreshing the whole page in this demo:

     

    https://demos.telerik.com/aspnet-ajax/lightbox/examples/templates/defaultvb.aspx?show-source=true

     

    Every time I click Next, the page is refreshed...

     

    Marc

  2. Attila Antal
    Admin
    Attila Antal avatar
    350 posts

    Posted 18 Jan Link to this post

    Hi Marc,

    If you enable AJAX for RadLightBox, it will not refresh the entire page. I've isolated the sample from the Demo you've pointed out and enabled AJAX for it. Check out the following short video for demonstration: RadLightBox with AJAX enabled

    I would like to note that having templates will always result in PostBacks which is described in the Lifecycle and Loading Content article, but you may enable AJAX to only do partial postbacks.

    Here is the sample code snippet I've used for the Video demo:

    ASPX - Markup

    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
            function openCodeLightBox(sender, args) {
                let lightBox = $find("<%=RadLightBox1.ClientID %>");
                lightBox.show();
            }
        </script>
    </telerik:RadCodeBlock>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadLightBox1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadLightBox1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <telerik:RadLabel ID="RadLabel1" runat="server"></telerik:RadLabel>
    <div class="container">
        <telerik:RadButton ID="RadButton1" runat="server" Text="Do PostBack without AJAX" CssClass="rbPrimaryButton"></telerik:RadButton>
        <telerik:RadButton RenderMode="Lightweight" ID="CodeButton" OnClientClicked="openCodeLightBox" AutoPostBack="false" Text="Open Lightbox" CssClass="rbPrimaryButton" runat="server" />
        <telerik:RadLightBox ID="RadLightBox1" runat="server" Width="1024px" Height="400px">
            <Items>
                <telerik:RadLightBoxItem>
                    <ItemTemplate>
                        <div class="content">
                            <pre runat="server" id="code1" class="brush: xml" onprerender="code1_PreRender"></pre>
                        </div>
                    </ItemTemplate>
                </telerik:RadLightBoxItem>
                <telerik:RadLightBoxItem>
                    <ItemTemplate>
                        <div class="content">
                            <pre runat="server" id="code2" class="brush: csharp" onprerender="code2_PreRender"></pre>
                        </div>
                    </ItemTemplate>
                </telerik:RadLightBoxItem>
            </Items>
        </telerik:RadLightBox>

    C# - Code behind

    protected void Page_Load(object sender, EventArgs e)
    {
        RadLabel1.Text = string.Format("Update Time on Page Load: <b>{0}</b>", DateTime.Now.TimeOfDay.ToString());
    }
     
    protected void code1_PreRender(object sender, EventArgs e)
    {
        StringBuilder sb = new StringBuilder();
        using (StreamReader sr = new StreamReader(Server.MapPath("resources/ExampleAspx.txt")))
        {
            String line = sr.ReadToEnd();
            sb.AppendLine(line);
        }
            (sender as System.Web.UI.HtmlControls.HtmlGenericControl).InnerText = sb.ToString();
    }
     
    protected void code2_PreRender(object sender, EventArgs e)
    {
        StringBuilder sb = new StringBuilder();
        using (StreamReader sr = new StreamReader(Server.MapPath("resources/ExampleCS.txt")))
        {
            String line = sr.ReadToEnd();
            sb.AppendLine(line);
        }
            (sender as System.Web.UI.HtmlControls.HtmlGenericControl).InnerText = sb.ToString();
    }

    Resources can be downloaded from the attachments.

    I hope this will be helpful.

    Kind regards,
    Attila Antal
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top