This is a migrated thread and some comments may be shown as answers.

Wrong visibility on RenderMode Lightweight

1 Answer 182 Views

PanelBar

This is a migrated thread and some comments may be shown as answers.

Missing User asked on 21 Jul 2020, 11:18 AM

panelclassic.jpg

panellightweight.jpg

I have a problem with this page, it does not display correctly:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Prueba2.aspx.cs" Inherits="Prueba2" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<link href="~/Content/bootstrap-grid.min.css" rel="stylesheet" />

<link href="~/Content/bootstrap-reboot.css" rel="stylesheet" />

<link href="~/Content/bootstrap.css" rel="stylesheet" />

<link href="~/Content/font-awesome.css" rel="stylesheet" />

<title></title>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadCodeBlock runat="server">

<script type="text/javascript">

</script>

</telerik:RadCodeBlock>

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

<Scripts>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js"></asp:ScriptReference>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js"></asp:ScriptReference>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js"></asp:ScriptReference>

</Scripts>

</telerik:RadScriptManager>

<telerik:RadAjaxManager ID="RadAjaxManagerEspecies" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="pnFecha">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="pnFecha" LoadingPanelID="RadAjaxLoadingPanel1"></telerik:AjaxUpdatedControl>

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" CssClass="loadingPanel" Transparency="20">

</telerik:RadAjaxLoadingPanel>

<telerik:RadWindowManager ID="rdwManager" runat="server">

</telerik:RadWindowManager>

<div class="container-fluid">

<div class="card" runat="server">

<div class="card-body">

<telerik:RadTabStrip runat="server" ID="RadTabStrip1" MultiPageID="RadMultiPage1" SelectedIndex="0">

<Tabs>

<telerik:RadTab runat="server" Text="Prueba" PageViewID="rpvFicha" Value="rpvFicha"></telerik:RadTab>

</Tabs>

</telerik:RadTabStrip>

<telerik:RadMultiPage runat="server" ID="RadMultiPage1" SelectedIndex="0" CssClass="card">

<telerik:RadPageView runat="server" ID="rpvFicha" CssClass="card-body">

<telerik:RadPanelBar runat="server" ID="rpnFicha" Width="100%" Style="margin-bottom: 0px">

<Items>

<telerik:RadPanelItem runat="server" Expanded="False" Text="Coordenadas" Visible="true" Value="habitats">

<ContentTemplate>

<telerik:RadTextBox ID="RadTextBox1" runat="server" Rows="3" MaxLength="3500" Wrap="false" Width="100%" TextMode="MultiLine"></telerik:RadTextBox>

</ContentTemplate>

</telerik:RadPanelItem>

</Items>

<Items>

<telerik:RadPanelItem runat="server" Expanded="False" Text="Bibliografía" Visible="true" Value="bibliografia">

<HeaderTemplate>

<a class="rpExpandable">

<span class="rpExpandHandle"></span>

</a>

<asp:Label Text="label1" ID="label1" runat="server" CssClass="rpText"> </asp:Label>

</HeaderTemplate>

<ContentTemplate>

<telerik:RadTextBox ID="rdtSituacion" runat="server" Rows="3" MaxLength="3500" Wrap="false" Width="100%" TextMode="MultiLine"></telerik:RadTextBox>

</ContentTemplate>

</telerik:RadPanelItem>

</Items>

<Items>

<telerik:RadPanelItem runat="server" Expanded="False" Text="Observaciones" Visible="true" Value="observaciones">

<ContentTemplate>

<telerik:RadTextBox ID="RadTextBox2" runat="server" Rows="3" MaxLength="3500" Wrap="false" Width="100%" TextMode="MultiLine"></telerik:RadTextBox>

</ContentTemplate>

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelBar>

</telerik:RadPageView>

</telerik:RadMultiPage>

</div>

</form>

</body>

</html>

In my webconfig i have this configuration:

<add key="Telerik.Web.UI.RenderMode" value="lightweight" />

But if i change the rendermode from the panel to Classic it is displayed well, What is the problem?

Thank you in advance

1 Answer, 1 is accepted

answered on 23 Jul 2020, 08:17 AM

Hi Angel,

The most common reason leading to such behavior is global CSS styling, which is affecting the layout of the control as well. Can you, please, remove temporary all custom CSS styles added to the page (including the Bootstrap ones) and see if the problem persists? If it is resolved after that, you can start removing the files one by one in order to determine which one is causing the problem.

If this does not help, please, send me a small runnable sample containing all references needed to reproduce the issue and I will examine the root of it at my end.

Regards,
Vessy
Progress Telerik