Questions on UI for ASP.NET AJAX Forum

1 answer

81 views

Problem with RadSwitch in Web User Control

Hi,

I am trying to implement RadSwitch in a Web Forms application. I copied the CSS from the Telerik Demo. When I apply the CSS class to a RadSwitch contained directly in the web form, it displays correctly. However, when I apply the same class to a RadSwitch contained in a web user control, it doesn’t display correctly.

I have tried several workarounds, including copying the CSS and embedding it into the web user control, but nothing works. The RadSwitch still displays incorrectly. The web user control and the RadSwitch that displays correctly are not in the same web form.

Here is the CSS:

/*Create elastic RadSwitch*/
.RadButton.RadSwitch.elasticSwitch .k-switch-handle {
width: 2em !important;
height: 2em !important;
display: flex !important;
}

.RadButton.RadSwitch.k-switch-on.elasticSwitch .k-switch-handle {
left: calc( 100% - 2em) !important;
display: flex !important;
}

.RadButton.RadSwitch.elasticSwitch,
.RadButton.RadSwitch.elasticSwitch .k-switch-container {
width: 4em !important;
display: flex !important;
}

Here are the CSS references for the web form and the web user control:

Web form CSS reference:

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
<link href="<%= Page.ResolveUrl("~/CSS/Custom.css") %>" rel="stylesheet" type="text/css" />
</asp:Content>

Web user control CSS reference:

Here is the HTML for the correctly displaying RadSwitch:

<telerik:RadSwitch runat="server" ID="TipoRequerimientoRequiereAcuse" Checked="false"
CssClass="elasticSwitch"
AutoPostBack="false">
</telerik:RadSwitch>

And here is the HTML for the RadSwich in the web user control:

<telerik:RadSwitch runat="server" ID="chkInformativo" Checked="false"
CssClass="elasticSwitch"
AutoPostBack="false">
</telerik:RadSwitch>

I am including some captures of both controls in runtime and some captures from both element analyses.

Has anyone else experienced this situation before? How did you solve it?

Ajax

Switch

answered on 21 Aug 2024

2 answers

98 views

Rad Gantt View or Scheduler for display Multiple tasks in one line.

Hi Telerik Team,

We are having the following requirement to display in our asp.net webform application. I were trying for Gantt view. But seems, it doesn't support multiple tasks to be shown in single line. Other option suggested is Rad Scheduler. As I am new to it, before going ahead with exploration, want to get confirmation that which control will suite our requirement. Please provide your feedback.

Thanks

Sathyendranath Pai

Sample requirement :

Gantt

Scheduler

answered on 21 Aug 2024

1 answer

59 views

How do i get different textboxes to populate into a radwindow

Having issues trying to get multiple textboxes to populate a single rad window depending on which submit button is clicked. I am trying to eventually output from rad window as it will post with what ever information I pull output onto window and then the start button will then timestamp. I am mainly just doing this piece by pice and want to just output something. This is the code that I have so far.

Imports Telerik.Web.UI

Partial Class TestPage
    Inherits System.Web.UI.Page


    Protected Sub Start_RadButton1_Click(ByVal sender As Object, ByVal e As EventArgs) Handles Start_RadButton1.Click
        ShowRadWindowWithContent(RadTextBox7.Text)
    End Sub

    Protected Sub Start_RadButton2_Click(ByVal sender As Object, ByVal e As EventArgs) Handles Start_RadButton2.Click
        ShowRadWindowWithContent(RadTextBox8.Text)
    End Sub

    Private Sub ShowRadWindowWithContent(ByVal content As String)
        ' Encode content to be safely used in JavaScript
        Dim encodedContent As String = HttpUtility.JavaScriptStringEncode(content)

        ' Register JavaScript to update and show the RadWindow
        Dim script As String = "function openRadWindow() { " _
        & "    var radWindow = $find('" & RadWindow2.ClientID & "'); " _
        & "    if (radWindow) { " _
        & "        var contentLabel = radWindow.get_contentElement().querySelector('#DynamicLabel'); " _
        & "        if (contentLabel) { " _
        & "            contentLabel.innerHTML = '" & encodedContent & "'; " _
        & "        } " _
        & "        radWindow.show(); " _
        & "    } " _
        & "} openRadWindow();"

        RadScriptManager.RegisterStartupScript(Me, Me.GetType(), "ShowRadWindow", script, True)
    End Sub
End Class

<%@ Page Language="vb" AutoEventWireup="false" CodeFile="TestPage.aspx.vb" Inherits="TestPage" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Dynamic RadWindow Example</title>
</head>
<body>
    <form id="form1" runat="server">
        
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
        <telerik:RadWindow ID="RadWindow2" runat="server" Modal="True" Skin="Metro" Visible="false">
            <ContentTemplate>
                <div class="content-container">
                    <div class="rad-label">
                        <telerik:RadLabel Text="Start Task?" runat="server" style="color: azure" />
                    </div>
                    <div id="contentContainer">
                        <telerik:RadLabel ID="DynamicLabel" runat="server" />
                    </div>
                    <div class="button-container">
                        <asp:Button ID="Button1" runat="server" Text="Start" />
                        <asp:Button ID="Button2" runat="server" Text="Cancel" />
                    </div>
                </div>
            </ContentTemplate>
        </telerik:RadWindow>

        <telerik:LayoutRow>
            <Columns>
                <telerik:LayoutColumn Span="3" SpanXs="0" SpanSm="0">
                    <div class="col">
                        <label>Test: </label>
                    </div>
                </telerik:LayoutColumn>
                <telerik:LayoutColumn Span="8" SpanXs="12" SpanSm="12">
                    <telerik:RadTextBox ID="RadTextBox7" RunAt="server"/>
                    <telerik:RadButton ID="Start_RadButton1" runat="server" Text="Start" OnClick="Start_RadButton1_Click" />
                </telerik:LayoutColumn>
            </Columns>
        </telerik:LayoutRow>

        <telerik:LayoutRow>
            <Columns>
                <telerik:LayoutColumn Span="3" SpanXs="0" SpanSm="0">
                    <div class="col">
                        <label>TimeStamp: </label>
                    </div>
                </telerik:LayoutColumn>
                <telerik:LayoutColumn Span="8" SpanXs="12" SpanSm="12">
                    <telerik:RadTextBox ID="RadTextBox8" RunAt="server"/>
                    <telerik:RadButton ID="Start_RadButton2" runat="server" Text="Start" OnClick="Start_RadButton2_Click" />
                    <telerik:RadButton ID="RadButton22" runat="server" Text="Completed"/>
                </telerik:LayoutColumn>
            </Columns>
        </telerik:LayoutRow>
    </form>
</body>
</html>

Window

answered on 21 Aug 2024

1 answer

79 views

Rendering a RadEditor in an IFrame in RadGrid column

So i have the following ItemTemplate defined for a RadGrid

<telerik:GridTemplateColumn DataField="Description" HeaderText="Description">
	<ItemTemplate>
		<iframe>
			<telerik:RadEditor ID="ContentEditor1" onClientLoad="OnClientLoad" CssClass="Modal-Scroll2" Enabled="false" ToolsFile="~/ToolsFileEmpty.xml" runat="server" EditModes="Preview" NewLineMode="br" ContentFilters="DefaultFilters" Width="100%" >
				<CssFiles>
					<telerik:EditorCssFile Value="~/css/EditorStyles.css" />
				</CssFiles>
			</telerik:RadEditor>
		</iframe>
	</ItemTemplate>
</telerik:GridTemplateColumn>

However, when this renders on the page, the editor content appears in the wrong place:

and the end result is a bunch of empty iframes:

Ideas?

-Mark

Editor

Grid

answered on 20 Aug 2024

1 answer

50 views

Is there a reason that ContentAreaMode is ignored when the editor is disabled?

I have blocks of HTML that are entered (usually copy and pasted in from email messages) by users of our system. We don't know what this content will contain, or if the content (html) is even completed (maybe the copied part of a HTML message). For that reason we display the content in a radeditor. This content is read-only, so we set the Enabled property of the RadEditor to "false". However when we do that, the content is no longer displayed in an iframe, despite using ContentAreaMode="Iframe".

When the editor is Enabled, it renders like this instead:

The reason that we are trying to have the content rendered in an IFRAME is because this content sometimes includes CSS/Styles that modify the content in the parent container.

For instance today we discovered this HTML embedded into a <style> tag.

div {
       display: block !important;
       visibility: visible !important;
       opacity: 1 !important
    }

And this caused all kinds of rendering problems on the page because it forced a ton of modal popup <div>'s to become visible that should be hidden.

Thanks for your help!

-Mark

Editor

answered on 19 Aug 2024

0 answers

75 views

Latest versions not in dropdown in Telerik Update Wizard.

Hi,

I cannot see the latest two downloaded version in my Update Wizard screen.

They are in the Update folder though, see screenshots.

VS 2022 Community with latest Telerik VS Extension.

Any suggestions?

Marc

Installer and VS Extensions

asked on 14 Aug 2024

1 answer

63 views

RadCloudUpload - Solution for Microsoft.WindowsAzure.Storage dependency

Hi,

Since the Microsoft.WindowsAzure.Storage is already deprecated, the RadCloudUpload is broken. Is there a solution for this or alternatives that you can suggest? Thank you

CloudUpload

answered on 13 Aug 2024

2 answers

50 views

Strange behavior with RadAjaxManager. Event fired with no user edition

Hi !

I've got strange behavior with RadAjaxManager.
no problem without radAjaxManager

Normally I have a panel and editing in that panel should update its contents. but strange behaviors appear.

To test, I just added 2 edit boxes only for updating.

Example project and example video to explain.

1) Set "cumul" => calculate and update the content deductionRG (AjaxSetting)
2) Set "Pénalités" => Calculate and update Total Deductions content (AjaxSetting)

But Event is launched on Montant RG???
Radnumeric is disabled and I don't want the event to be fired if there was no user input.

3) Set "Autre" => Event launched but content received: 0
4) Define "Autre" again (other value: 80) => Value of the content received by the event: 80

This is a simple example, because this edition panel modifies for the user according to conditional parameters on the screen during the instance of the calculation class.

Ajax

updated answer on 13 Aug 2024

0 answers

43 views

RadTreeList / RadSpreadProcessing export to excel

I have a RadTreeList and my data consists of 3 levels/hierarchy. I want to export it to excel with the grouping functionality. Unfortunately, Radtreelist doesn't have this functionality. Has anyone done something similar with RadSpreadProcessing?

I've read the documentation https://docs.telerik.com/devtools/document-processing/libraries/radspreadprocessing/features/grouping but haven't had any luck in implementing it.

Spreadsheet

TreeList

asked on 12 Aug 2024

1 answer

112 views

Passing Telerik Grid Data To Javascript Function Declared in 'OnClientClick'

I am trying to open a new window when a user clicks a button but need to pass 'CallLogID' into my query parameters. For the life of me I can not seem to get the CallLogID to show up. The value of CallLogID is in a datafield set to Display="False". I have tried using <%# Eval() %> but maybe I am not using the appropriate escape characters. Any help would be much appreciated.

Here are my code snippets that are currently working to open a new tab and navigate to the specified URL.

            <telerik:GridTemplateColumn HeaderText="Follow Up" UniqueName="FollowUp">
                <HeaderStyle Width="22%" /> 
                <ItemStyle Width="22%" /> 
                <ItemTemplate>
                    <asp:LinkButton ID="lnkFollowUp" runat="server" OnClick="FollowUpView" ToolTip="Follow Up">
                        (<%# Eval("FollowUpCount") %>) view
                    </asp:LinkButton>
                    <asp:Literal ID="separator" runat="server" Text=" | " />
                    <asp:LinkButton ID="FollowUpAdd" runat="server" Text="add" ToolTip="Follow Up" OnClientClick="window.open('addfollowuptocalllog.aspx?calllogid=', '_blank'); return false;"/>
                </ItemTemplate>
            </telerik:GridTemplateColumn>

            <telerik:GridBoundColumn DataField="CallLogID" UniqueName="CallLogID" Visible="True" Display="False">
                <ColumnValidationSettings>
                    <ModelErrorMessage Text=""></ModelErrorMessage>
                </ColumnValidationSettings>
            </telerik:GridBoundColumn>

Grid

Window

answered on 05 Aug 2024