Questions on UI for ASP.NET AJAX Forum

2 answers

69 views

Prevent pop-ups when RadEditor Spellcheck is complete & Other minor annoyances

I know I should create separate questions, but these are all so minor it doesn't seem worthwhile.

Is there a way to prevent the annoying pop-up when the spellcheck is complete? Or if there needs to be one couldn't a RadAlert be used instead of the default browser dialog? At least the look would be more consistent.
Are there parameters that can be used to determine how spellcheck handles capitalization? For instance it thinks "THe" is correct because it's not checking capitalization
How can I increase the width of the pop-up window? I changed the font and now the pop-up is too narrow and the text wraps. It appears the width is set on the element so that was overriding anything I tried to change in the classes being used.

Editor

Spell

answered on 08 May 2024

1 answer

98 views

RadEditor File/Image Upload Not Working

When try upload file/image i got error "check image"

        <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadEditor ID="RadEditor1" runat="server" SkinID="BasicSetOfTools" Height="500px" 
    ContentFilters="DefaultFilters,PdfExportFilter" ContentAreaMode="Div" NewLineMode="Br, P" ExternalDialogsPath="~/EditorDialogs" EnableResize="False"><ExportSettings OpenInNewWindow="True"></ExportSettings><Tools><telerik:EditorToolGroup Tag="MainToolbar"><telerik:EditorTool Name="XhtmlValidator" /><telerik:EditorTool Name="PageProperties" /><telerik:EditorTool Name="StyleBuilder" /><telerik:EditorTool Name="TrackChangesDialog" /><telerik:EditorTool Name="FormatCodeBlock" /><telerik:EditorSeparator /><telerik:EditorTool Name="InsertImage" /><telerik:EditorTool Name="InsertLink" /><telerik:EditorTool Name="InsertTableLight" /><telerik:EditorSeparator /><telerik:EditorToolStrip Name="InsertFormElement"></telerik:EditorToolStrip><telerik:EditorTool Name="InsertFormForm" /><telerik:EditorTool Name="InsertFormButton" /><telerik:EditorTool Name="InsertFormCheckbox" /><telerik:EditorTool Name="InsertFormHidden" /><telerik:EditorTool Name="InsertFormPassword" /><telerik:EditorTool Name="InsertFormRadio" /><telerik:EditorTool Name="InsertFormReset" /><telerik:EditorTool Name="InsertFormSelect" /><telerik:EditorTool Name="InsertFormSubmit" /><telerik:EditorTool Name="InsertFormTextarea" /><telerik:EditorTool Name="InsertFormText" /><telerik:EditorSeparator /><telerik:EditorTool Name="StripAll" /><telerik:EditorTool Name="StripCss" /><telerik:EditorTool Name="StripFont" /><telerik:EditorTool Name="StripSpan" /><telerik:EditorTool Name="StripWord" /></telerik:EditorToolGroup><telerik:EditorToolGroup Tag="InsertToolbar"><telerik:EditorTool Name="ImageManager" ShortCut="CTRL+M" /><telerik:EditorTool Name="ImageMapDialog" /><telerik:EditorSeparator /><telerik:EditorTool Name="FlashManager" /><telerik:EditorTool Name="MediaManager" /><telerik:EditorTool Name="InsertExternalVideo" /><telerik:EditorSeparator /><telerik:EditorTool Name="DocumentManager" /><telerik:EditorTool Name="TemplateManager" /><telerik:EditorSeparator /><telerik:EditorToolStrip Name="InsertTable"></telerik:EditorToolStrip><telerik:EditorTool Name="InsertRowAbove" /><telerik:EditorTool Name="InsertRowBelow" /><telerik:EditorTool Name="DeleteRow" /><telerik:EditorTool Name="InsertColumnLeft" /><telerik:EditorTool Name="InsertColumnRight" /><telerik:EditorTool Name="DeleteColumn" /><telerik:EditorSeparator /><telerik:EditorTool Name="MergeColumns" /><telerik:EditorTool Name="MergeRows" /><telerik:EditorSeparator /><telerik:EditorTool Name="SplitCellHorizontal" /><telerik:EditorTool Name="SplitCell" /><telerik:EditorTool Name="DeleteCell" /><telerik:EditorTool Name="SetCellProperties" /><telerik:EditorTool Name="SetTableProperties" /><telerik:EditorSeparator /><telerik:EditorSplitButton Name="InsertSymbol"></telerik:EditorSplitButton><telerik:EditorToolStrip Name="FormatStripper"></telerik:EditorToolStrip></telerik:EditorToolGroup><telerik:EditorToolGroup><telerik:EditorSplitButton Name="Undo"></telerik:EditorSplitButton><telerik:EditorSplitButton Name="Redo"></telerik:EditorSplitButton><telerik:EditorSeparator /><telerik:EditorTool Name="Cut" /><telerik:EditorTool Name="Copy" /><telerik:EditorTool Name="Paste" ShortCut="CTRL+V" /><telerik:EditorSeparator /><telerik:EditorTool Name="PasteFromWord" /><telerik:EditorTool Name="PasteFromWordNoFontsNoSizes" /><telerik:EditorTool Name="PastePlainText" /><telerik:EditorTool Name="PasteAsHtml" /><telerik:EditorTool Name="PasteHtml" /><telerik:EditorSeparator /><telerik:EditorTool Name="Print" /><telerik:EditorTool Name="FindAndReplace" /><telerik:EditorTool Name="SelectAll" /><telerik:EditorSeparator /><telerik:EditorTool Name="InsertGroupbox" /><telerik:EditorTool Name="InsertParagraph" /><telerik:EditorTool Name="InsertHorizontalRule" /><telerik:EditorSplitButton Name="InsertSnippet"></telerik:EditorSplitButton><telerik:EditorSeparator /><telerik:EditorTool Name="InsertDate" /><telerik:EditorTool Name="InsertTime" /><telerik:EditorSeparator /><telerik:EditorTool Name="AboutDialog" /><telerik:EditorTool Name="Help" /></telerik:EditorToolGroup><telerik:EditorToolGroup><telerik:EditorTool Name="Bold" /><telerik:EditorTool Name="Italic" /><telerik:EditorTool Name="Underline" /><telerik:EditorTool Name="StrikeThrough" /><telerik:EditorSeparator /><telerik:EditorTool Name="JustifyLeft" /><telerik:EditorTool Name="JustifyCenter" /><telerik:EditorTool Name="JustifyRight" /><telerik:EditorTool Name="JustifyFull" /><telerik:EditorTool Name="JustifyNone" /><telerik:EditorSeparator /><telerik:EditorTool Name="Superscript" /><telerik:EditorTool Name="Subscript" /><telerik:EditorSeparator /><telerik:EditorTool Name="ConvertToLower" /><telerik:EditorTool Name="ConvertToUpper" /><telerik:EditorTool Name="Indent" /><telerik:EditorTool Name="Outdent" /><telerik:EditorTool Name="InsertOrderedList" /><telerik:EditorTool Name="InsertUnorderedList" /><telerik:EditorTool Name="AbsolutePosition" /><telerik:EditorTool Name="InsertSpecialLink" Text="Insert Special Link"/><telerik:EditorTool Name="LinkManager" /><telerik:EditorTool Name="Unlink" /><telerik:EditorTool Name="ToggleTableBorder" /><telerik:EditorTool Name="ToggleScreenMode" /></telerik:EditorToolGroup><telerik:EditorToolGroup Tag="DropdownToolbar"><telerik:EditorSplitButton Name="ForeColor"></telerik:EditorSplitButton><telerik:EditorSplitButton Name="BackColor"></telerik:EditorSplitButton><telerik:EditorSeparator /><telerik:EditorDropDown Name="FontName"></telerik:EditorDropDown><telerik:EditorDropDown Name="FontSize"></telerik:EditorDropDown><telerik:EditorDropDown Name="RealFontSize"></telerik:EditorDropDown><telerik:EditorDropDown Name="ApplyClass"></telerik:EditorDropDown><telerik:EditorDropDown Name="InsertCustomLink"></telerik:EditorDropDown><telerik:EditorDropDown Name="FormatBlock"></telerik:EditorDropDown><telerik:EditorDropDown Name="Zoom"></telerik:EditorDropDown></telerik:EditorToolGroup></Tools><Content></Content><ImageManager MaxUploadFileSize="9242880" DeletePaths="~/UpLoadImages" UploadPaths="~/UpLoadImages"
        ViewPaths="~/UpLoadImages" /><DocumentManager MaxUploadFileSize="9242880" DeletePaths="~/UploadFiles" UploadPaths="~/UploadFiles"
        ViewPaths="~/UploadFiles" /><FlashManager MaxUploadFileSize="9242880" DeletePaths="~/UploadFiles" UploadPaths="~/UploadFiles"
        ViewPaths="~/UploadFiles" /><SilverlightManager MaxUploadFileSize="9242880" DeletePaths="~/UploadFiles" UploadPaths="~/UploadFiles"
        ViewPaths="~/UploadFiles" /><MediaManager MaxUploadFileSize="9242880" DeletePaths="~/UploadFiles" UploadPaths="~/UploadFiles"
        ViewPaths="~/UploadFiles" /><TemplateManager MaxUploadFileSize="9242880" DeletePaths="~/UploadFiles" UploadPaths="~/UploadFiles"
        ViewPaths="~/UploadFiles" /></telerik:RadEditor><script type="text/javascript">
    Telerik.Web.UI.Editor.CommandList["InsertSpecialLink"] = function (commandName, editor, args) {
        var elem = editor.getSelectedElement(); //returns the selected element.            
        if (elem.tagName == "A") {
            editor.selectElement(elem);
            argument = elem;
        }
        else {
            var content = editor.getSelectionHtml();
            var link = editor.get_document().createElement("A");
            link.innerHTML = content;
            argument = link;
        }

        var myCallbackFunction = function (sender, args) {
            editor.pasteHtml(String.format("<a href={0} target='{1}' class='{2}'>{3}</a> ", args.href, args.target, args.className, args.name))
        }

        editor.showExternalDialog(
            'InsertLink.aspx',
            argument,
            870,
            600,
            myCallbackFunction,
            null,
            'Insert Link',
            true,
            Telerik.Web.UI.WindowBehaviors.Close + Telerik.Web.UI.WindowBehaviors.Move,
            false,
            false);
    };
</script>

Editor

FileExplorer

answered on 07 May 2024

1 answer

127 views

RadEditor OnClientLoad not firing

I am trying to remove the curly red underlines for misspelled words and outlined here: Disable browser spellcheck and curly red underlines in RadEditor content area. But the OnClientLoad event never fires. There are no errors on the console log, the editor is enabled, and it is visible.

I'm a little stuck as to what else I can try.

        <div class="SectionBody">
            <telerik:RadEditor ID="redPlan" runat="server" SkinID="EditorDefault" Height="170" Width="500" OnClientLoad="OnClientLoad" />
            <asp:CustomValidator ID="cvPlan" runat="server" ControlToValidate="redPlan" ClientValidationFunction="EditorRequired" ValidateEmptyText="true"
                Text="Required" ValidationGroup="vgDAP" />
        </div>

<telerik:RadScriptBlock runat="server">
    <script type="text/javascript">
        function OnClientLoad(sender, args) {
            sender.get_contentArea().setAttribute("spellcheck", "false");
        }
    </script>
</telerik:RadScriptBlock>

Editor

answered on 07 May 2024

1 answer

200 views

Error code: STATUS_ACCESS_VIOLATION on Radwindow close

I mm facing an issue on my ASP.NET page where I'm using RegisterStartupScript to call a JavaScript function from the code-behind.

The JavaScript function is intended to close a Telerik RadWindow using

var oWnd = GetRadWindow();

oWnd.close();.

However, upon execution,

I receive the following error:

'Error code: STATUS_ACCESS_VIOLATION'. Could you please assist me in resolving this issue?

Ajax

Window

answered on 07 May 2024

1 answer

85 views

RadPage column floating to the right

Hello. I am trying to make a header in master page with 2 columns. Column 1 has 3 buttons (to the left) and column 2 has a label about user logged in. I am trying to push this label to the right. If I specify Span 10 for first column and Span 2 for second, label is not pushed to the edge. If I specify push=1, then label appears positioned correctly on the screen, but horizontal scrollbar appears.

What am I missing?

<telerik:RadPageLayout runat="server" ID="MasterLayout" GridType="Fluid">
	<Rows>
		<%--Header--%>
		<telerik:LayoutRow CssClass="header">
			<Columns>
				<%--Logo--%>

				<%--Main Nav--%>
				<telerik:LayoutColumn Span="10">
					<telerik:RadLinkButton ID="btnInsurance" runat="server" Text="Payment Posting App" NavigateUrl="Default.aspx" Primary="true"></telerik:RadLinkButton>
					<telerik:RadLinkButton ID="btnInsurances" runat="server" Text="Insurances" NavigateUrl="Insurances.aspx" Skin="WebBlue"></telerik:RadLinkButton>
					<telerik:RadLinkButton ID="btnLockBox" runat="server" Text =" Lockbox Data" NavigateUrl="Lockbox.aspx"></telerik:RadLinkButton>
				</telerik:LayoutColumn>
				<telerik:LayoutColumn Span="2" Push="1">
					<asp:Label ID="name" runat="server" CssClass="userLabel" Text="Welcome: "></asp:Label>
					<asp:label ID="lblUser" runat="server" CssClass="userLabel"></asp:label>
				</telerik:LayoutColumn>
			</Columns>
		</telerik:LayoutRow>
		<%--Main--%>
		<telerik:LayoutRow>
			<Columns>
				<%--Content--%>
				<telerik:CompositeLayoutColumn Span="12" SpanMd="12" SpanSm="12" SpanXs="12">
					<Content>
						<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
						</asp:ContentPlaceHolder>
						<asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
						</asp:ContentPlaceHolder>
					</Content>
				</telerik:CompositeLayoutColumn>
			</Columns>
		</telerik:LayoutRow>
		<%--Footer--%>
		<telerik:LayoutRow>
			<Columns>
				<telerik:LayoutColumn CssClass="footer">
					<hr />
					© 2024 Rothman
				</telerik:LayoutColumn>
			</Columns>
		</telerik:LayoutRow>
	</Rows>
</telerik:RadPageLayout>

PageLayout

answered on 02 May 2024

1 answer

220 views

DNN 9.11.3 Telerik Fix

I realize this isn't a DNN forum, but couldn't find anything there so hoping someone here can answer.

After upgrading to DNN 9.11.3 several modules don't work right because DNN no longer supports Telerik.

I've read somewhere that you can purchase a Telerik license and just update the dlls for it in DNN in order to resolve this issue.

Has anyone else had this experience?

Thanks

Ajax

answered on 02 May 2024

1 answer

152 views

Double quote get switched to single quote and vice versa in Telerik UI for RichText Editor

Hi,

Anyone had issue with RichText editor automatically replacing double quote " with single quote ' and vice versa, when toggling between Design and HTML mode? I have tested all options under "BUILT-IN FILTERS CONFIGURATOR" and they all switched the double quote with single quote and vice versa, which breaks the HTML5 data attribute element as the single quote formatting is important for JSON specification.

https://demos.telerik.com/aspnet-ajax/editor/examples/builtincontentfilters/defaultcs.aspx

I have attached a snippet of the code, which shows data-wb-geomap element's single quote got replaced with double quote after toggling between Design and HTML mode.

Before (HTML mode):

<div id="geomap1" class="wb-geomap position scaleline geocoder geolocation mapcontrols" data-wb-geomap='{

"tables": [{

"title": "Test",

"caption": "Test",

"id": "test",

"zoom": true,

"tab": true,

"type": "symbol"

}

}]

}'>

After (Design mode):

<div id="geomap1" class="wb-geomap position scaleline geocoder geolocation mapcontrols" data-wb-geomap="{

'tables': [{

'title': 'Test',

'caption': 'Test',

'id': 'test',

'zoom': true,

'tab': true,

'type': 'symbol'

}

}]

}'>

UI for ASP.NET AJAX in ASP.NET MVC

answered on 25 Apr 2024

0 answers

69 views

How do I add a custom date comparison operator with RadFilter?

I need to be able to add an "In Time Period" comparison operator option to the dropdown list. Once the user has selected this option we would display a custom RadFilterDataFieldEditor with a dropdown list of options to choose from ("In Next 7 days", "In Next 30 days", etc). This would be displayed in place of the built-in calendar control that would be displayed if they chose another comparison operator (such as "Greater than", etc). How do I add a new comparison operator to the list? The documentation shows how to remove menu items (Customizing the Menu), but not how to add menu items. Please advise. Thanks

Filter

asked on 24 Apr 2024

1 answer

104 views

RadGrid popup position

Hello, I am having problem positioning correctly popup window when grid pagesize is 100 and grid using static headers.

When scrolling to the bottom of the page and clicking edit button, popup form displaying outside of screen boundries.

I tried approach with implementing event OnPopShowing, but I think it missing Y position in scrolling area.

    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
      <script type="text/javascript">
          var popUp;
          function PopUpShowing(sender, eventArgs) {
              popUp = eventArgs.get_popUp();
              var gridWidth = sender.get_element().offsetWidth;
              var gridHeight = sender.get_element().offsetHeight;
              var popUpWidth = popUp.style.width.substr(0, popUp.style.width.indexOf("px"));
              var popUpHeight = popUp.style.height.substr(0, popUp.style.height.indexOf("px"));
              popUp.style.left = ((gridWidth - popUpWidth) / 2 + sender.get_element().offsetLeft).toString() + "px";
              popUp.style.top = ((gridHeight - popUpHeight) / 2 + sender.get_element().offsetTop).toString() + "px";
          }
      </script>
    </telerik:RadCodeBlock>

    <telerik:RadGrid ID="gridLockbox" runat="server" PageSize="100" PagerStyle-PageButtonCount="5"
        OnNeedDataSource="gridLockbox_NeedDataSource" OnDetailTableDataBind="gridLockbox_DetailTableDataBind"
        OnItemDataBound="gridLockbox_ItemDataBound" OnUpdateCommand="gridLockbox_UpdateCommand"
        AllowPaging="true" AllowSorting="true" ShowGroupPanel="true" Height="700px"
        RenderMode="Lightweight" Skin="WebBlue">
        <GroupingSettings ShowUnGroupButton="True" CaseSensitive="false" />
        <ClientSettings AllowColumnsReorder="true" AllowColumnHide="true" AllowDragToGroup="true">
            <Scrolling AllowScroll="true" UseStaticHeaders="true" SaveScrollPosition="true" />
            <ClientEvents OnPopUpShowing="PopUpShowing" />
        </ClientSettings>
        <MasterTableView EditMode="PopUp" AutoGenerateColumns="false" AllowFilteringByColumn="true" DataKeyNames="TransUID"
            AllowMultiColumnSorting="true" CommandItemDisplay="None" ShowGroupFooter="true" TableLayout="Fixed" Font-Size="10">
            <EditFormSettings EditFormType="WebUserControl" UserControlName="LockboxCtrl.ascx">
                <PopUpSettings Modal="true" Width="1500px" KeepInScreenBounds="False"/>
            </EditFormSettings>
        </MasterTableView>
    </telerik:RadGrid>

Grid

answered on 22 Apr 2024

0 answers

76 views

Sample for DataPager used with a client-side databound ListView

I have a ListView using automatic client-side databinding to a web service. Additionally, there is a DataPager placed just after the ListView in the page's markup as in the code pasted below.

When the page loads, the ListView shows data, which means the automatic client-side databinding is working, but the DataPager is showing nothing i.e. there is no pager visible even though there is more than one page of records in the database.

Is there a sample that uses a similar scenario of DataPager with a ListView? I tried searching online, but couldn't find any.

<telerik:RadListView ID="RadListView1" runat="server" RenderMode="Auto" AllowPaging="true" PageSize="5" ItemPlaceholderID="items">
    <ClientSettings>
        <ClientEvents OnDataBinding="RadListView1_Comments_DataBinding" OnDataBound="RadListView1_Comments_DataBound" OnDataSourceResolved="RadListView1_Comments_DataSourceResolved" />
        <DataBinding ItemPlaceHolderID="items">
            <LayoutTemplate>
                        <label for="" class="comments">Comments</label>
                        <div id="items"></div>
                       <%--<div id="pagerContainer"></div>--%>
            </LayoutTemplate>
            <ItemTemplate>
                       <div>
                            <div class="subject">#=Subject#</div>
                            <div class="comment">#=CommentText#</div>
                            <div class="author">by #=Author# on #=CreateDate# </div>
                      </div> 
            </ItemTemplate>
            <EmptyDataTemplate>
                        <div>
                            No Comments have been posted for this page
                        </div>
            </EmptyDataTemplate>
            <DataService Location="~/CommentsService.asmx" DataPath="GetComments" FilterParameterType="Sql" SortParameterType="Sql" CountPropertyName="Count"></DataService>
        </DataBinding>
    </ClientSettings>
</telerik:RadListView>
<telerik:RadDataPager RenderMode="Auto" ID="RadDataPager1" runat="server" PagedControlID="RadListView1">
    <Fields>
        <telerik:RadDataPagerButtonField FieldType="FirstPrev"></telerik:RadDataPagerButtonField>
        <telerik:RadDataPagerButtonField FieldType="Numeric"></telerik:RadDataPagerButtonField>
        <telerik:RadDataPagerButtonField FieldType="NextLast"></telerik:RadDataPagerButtonField>
        <telerik:RadDataPagerGoToPageField></telerik:RadDataPagerGoToPageField>
    </Fields>
</telerik:RadDataPager>

I tried adding the following JavaScript code in the client-side databinding event of ListView so that all needed properties of DataPager get set, but still the DataPager shows nothing.

function RadListView1_Comments_DataBound(sender, args) {
    //set datapager properties
    let dataPager = $find(pageBag.radDataPager1Id);
    dataPager.set_currentPageIndex(sender._currentPageIndex);
    dataPager._totalRowCount = sender._virtualItemCount;
    dataPager.set_pageSize(sender._pageSize);
    dataPager._pageCount = Math.ceil(dataPager._totalRowCount / dataPager._pageSize);
    dataPager._startRowIndex = startRowIndex;
}

DataPager

ListView

updated question on 22 Apr 2024