Questions on UI for ASP.NET AJAX Forum

1 answer

91 views

I have the following in my Telerik Grid:

<telerik:GridCalculatedColumn HeaderText="Remark Code" DataFields="RemarkCodeID, RemarkCodeName" Expression='{0} + " - " + {1}' DataFormatString="{0:N}" ></telerik:GridCalculatedColumn>

I get an error that cannot convert an Int and RemarkCodeID is an int above. Is there a way I can convert RemarkCodeID to a string? Also, when I replace RemarkCodeID with a data field that is of type string, no error so I know it is RemarkCodeID that is causing the error.

Error:
System.ArgumentException: Expression of type 'System.Nullable`1[System.Int32]' cannot be used for parameter of type 'System.Object' of method 'System.String Concat(System.Object, System.Object)'

Grid

answered on 28 Apr 2014

11 answers

412 views

Expand/Dropdown on Hover

Is there a way to cause the combo box to dropdown automatically when you hover the mouse over it?

ComboBox

answered on 28 Apr 2014

4 answers

462 views

How to select a row on serverside based on the datakey

I have been digging through the help and could not find a solution.

I need to select a row server side based on the ID. The following piece of code does not find the item:

if (Session["selID"] != null)

{

GridDataItem item = RadGrid1.MasterTableView.FindItemByKeyValue("Container_ID", Session["selID"].ToString());

item.Selected = true;

Session["selID"] = null;

}

So I'm using the following method

if (Session["selID"] != null)

{

foreach (GridItem item in RadGrid1.MasterTableView.Items)

{

if (item is GridDataItem)

{

GridDataItem dataItem = (GridDataItem)item;

if (Session["selID"].ToString().Equals(dataItem.OwnerTableView.DataKeyValues[dataItem.ItemIndex]["Container_ID"].ToString()))

{

dataItem.Selected = true;

Session["selID"] = null;

break;

}

Somehow I feel that there has to be a better way to do it. I will appreciate if you could please suggest the optimum way.

Thanks

Som

Grid

answered on 27 Apr 2014

1 answer

74 views

Expand Parent after Creating New Child

I am wanting to expand the parent node after I add a child node using the "PerformInsert" command. Currently the child does get added but is not visible since the parent is collapsed.

TreeList

answered on 25 Apr 2014

6 answers

185 views

Highlighting the radgrid column based on radiobutton check in the header template

I have a Radio Button in header template of Rad grid columns. When user selects the radiobutton that particular column should be highlighted remaining should be greyed out.

<telerik:GridTemplateColumn DataField="BR" UniqueName="BR" HeaderStyle-Font-Bold="true" DataType="System.Double" HeaderText="BR" HeaderStyle-HorizontalAlign="Center" ItemStyle-HorizontalAlign="Center">
<HeaderTemplate>
<asp:RadioButton ID="rbBR" Text="Board Repair" runat="server" OnCheckedChanged="rbBR_CheckedChanged" AutoPostBack="true" />
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="lbBR" runat="server" Text= '<%# DataBinder.Eval(Container.DataItem,"BR") %>'></asp:Label>
</ItemTemplate>
</telerik:GridTemplateColumn>

Please let me know how to accomplish this.

Grid

answered on 25 Apr 2014

4 answers

105 views

Splitter Height problem

I have a page with a master page in a C# 4.0 Web app (Visual Studio 2012.)

From my reading I am aware that there are potential problems in making a RadSplitter fill a page.
This page consists of 3 horizontal sections on the left and one vertical one on the right.
Up till now this page has been operated using Javascript to expose/hide controls and expand/collapse the RadPaneForm control.
Basically, the expand/collapse of RadPaneForm needs to be controlled by a RadComboBox in the center left section of the splitter.

I've been trying to 'Ajax-ify' the splitter in order to replace the JavaScript with code-behind C#.
(And for once I've had the time and ability to boil the problem down to a demo. Here it is.
The page has no code-behind in either the master page or the TestPage. Note that there are two RadComboBoxes in Panel1.

The problem is as follows: The splitter displays at half page height unless I remove one of the RadComboBoxes. Then it displays at full height.

Master Page html:
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="SiteTest.Master.cs" Inherits="WebApplicationSplitterTest.SiteTest" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body >
<form id="form1" runat="server" >
<asp:ContentPlaceHolder ID="cph1" runat="server">
</asp:ContentPlaceHolder>
<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
</Scripts>
</telerik:RadScriptManager>
<header>
</header>
<div id="ParentDivElement" style="height:85%">
<asp:ContentPlaceHolder ID="MainContent" runat="server">
</asp:ContentPlaceHolder>
</div>
<div style="text-align: center; margin: auto; margin-left: auto; margin-right: auto; width: 100%; margin-bottom: auto;height:20px">
<br />
<br />
<p> This is a footer</p>
</div>

</form>
</body>
</html>

Main Page HTML:

<%@ Page Language="C#" Async="true" MasterPageFile="~/SiteTest.Master" AutoEventWireup="true" CodeBehind="TestPage.aspx.cs" Inherits="WebApplicationSplitterTest.TestPage" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="RadSplitter1">

</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="ddlOne">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="ddlTwo" />
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="ddlTwo">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="RadSplitter1" />
<telerik:AjaxUpdatedControl ControlID="Panel1" />
<telerik:AjaxUpdatedControl ControlID="Panel2" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>

<telerik:RadInputManager ID="RadInputManager1" runat="server">
</telerik:RadInputManager>

<telerik:RadWindowManager ID="RadWindowManager1" runat="server" VisibleStatusbar="false" VisibleTitlebar="true" Width="600px">
</telerik:RadWindowManager>

<script src="Scripts/jquery-1.7.1.js"></script>

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

<style type="text/css">
html, body, form {
height: 100%;
margin: 0px;
padding: 0px;
}
</style>

</telerik:RadCodeBlock>

<telerik:RadSplitter ID="RadSplitter1" runat="server" Height="100%" Width="100%" HeightOffset="20" Orientation="Vertical" >

<telerik:RadPane ID="RadpaneTicket" runat="server" Height="100%" Width="70%" Scrolling="Y" >
<telerik:RadSplitter runat="server" Height="100%" Width="100%" Orientation="Horizontal">
<telerik:RadPane ID="RadPane1" runat="server" Scrolling="None" Height="25px">
<div style="width: 100%; text-align: center">
<asp:Label ID="lblAnnouncements" runat="server" Text='Announcements' Font-Bold="True" ForeColor="Blue" Font-Size="Large"></asp:Label>
</div>
</telerik:RadPane>
<telerik:RadSplitBar ID="RadSplitBar3" runat="server" Visible="false"></telerik:RadSplitBar>
<telerik:RadPane ID="RadpaneAnnouncements" runat="server" Height="15%" Scrolling="Both" BackColor="AliceBlue">
<div style="width: 100%; text-align: center;">
<asp:Label ID="lblNone" runat="server" Text='There are no current announcements' Visible="false" Font-Bold="True" BackColor="AliceBlue" ForeColor="Black" Font-Size="Large"></asp:Label>
</div>
<div style="width: 95%; height: 100%; margin-left: auto; margin-right: auto">

</div>
</telerik:RadPane>
<telerik:RadSplitBar ID="RadSplitBar2" runat="server" ></telerik:RadSplitBar>
<telerik:RadPane runat="server" Scrolling="Y" >
<telerik:RadSplitter ID="RadSplitterEditor" runat="server" >
<telerik:RadPane ID="RadPaneEditor" runat="server">

<table style="width: 100%; height: 100%; margin-top: auto; margin-bottom:auto">
<tr>
<td colspan="2">
<asp:ValidationSummary ID="ValidationSummary2" runat="server" Font-Bold="True" ForeColor="Red" />
</td>
</tr>
<tr>
<td colspan="2"></td>
</tr>
<tr style="width: 100%; vertical-align: top; height: 5%;">
<td style="text-align: left;" colspan="2">
<asp:Panel ID="Panel1" runat="server" Width="100%" Height="100%" >

<telerik:RadComboBox ID="ddlOne" runat="server"
Height="100px" Label="RadComboBox 1" Sort="Ascending" NoWrap="true" Font-Size="Large" Width="301px" Font-Names="Arial" AutoPostBack="true" CausesValidation="False">
</telerik:RadComboBox>
<telerik:RadComboBox ID="ddlTwo" runat="server"
Height="200px" Label="RadComboBox2" Sort="Ascending" NoWrap="True" Font-Size="Large" Width="275px" Font-Names="Arial" AutoPostBack="true" >
</telerik:RadComboBox>

</asp:Panel>
</td>
</tr>
<tr>
<td style="width: 100%; height: 85%" colspan="2">
</td>
</tr>
</table>

<div>
<telerik:RadProgressManager ID="RadProgressManager1" runat="server" />
<telerik:RadProgressArea ID="RadProgressArea1" runat="server" ProgressIndicators="TotalProgressBar, TotalProgress, TotalProgressPercent, RequestSize, FilesCountBar, FilesCount, SelectedFilesCount, CurrentFileName, TimeElapsed, TimeEstimated, TransferSpeed"></telerik:RadProgressArea>
</div>

</telerik:RadPane>

<telerik:RadSplitBar ID="RadSplitBarForm" runat="server"></telerik:RadSplitBar>
<telerik:RadPane ID="RadPaneForm" runat="server" Scrolling="Both" Collapsed="false" Width="100%" Height="100%">
<asp:Panel ID="Panel2" runat="server">

</asp:Panel>
</telerik:RadPane>

</telerik:RadSplitter>

</telerik:RadPane>
<telerik:RadSplitBar ID="RadSplitBar5" runat="server" EnableResize="false">
</telerik:RadSplitBar>

<telerik:RadPane ID="RadPane3" runat="server" Height="40px" Scrolling="None" Width="100%" >
<table style="width:100%">
<tr style="height: 40px; width:100%">
<td style="width: 70%; float: left;">
<telerik:RadUpload ID="RadUpload1" runat="server" ControlObjectsVisibility="ClearButtons" TargetFolder="~/Files" InputSize="40" ></telerik:RadUpload>
</td>
<td style="width: 25%; float: right; text-align: right;">
<telerik:RadButton ID="btnSave" runat="server" Text="Save" ></telerik:RadButton>
  
<telerik:RadButton ID="btnCancel" runat="server" Text="Clear" CausesValidation="False" ></telerik:RadButton>
</td>
</tr>
</table>
</telerik:RadPane>
</telerik:RadSplitter>
</telerik:RadPane>

<telerik:RadSplitBar ID="RadSplitBar1" runat="server"></telerik:RadSplitBar>

<telerik:RadPane ID="RadPaneRightSide" runat="server" Width="30%" Height="15%" Scrolling="None">
<telerik:RadSplitter ID="RadSplitter2" runat="server" Orientation="Horizontal">
<telerik:RadPane ID="RadPane2" runat="server" Scrolling="None" Height="25px">
<div style="width: 100%; text-align: center">
<asp:Label ID="Label2" runat="server" Text='System Status' Font-Bold="True" ForeColor="Blue" Font-Size="Large"></asp:Label>
</div>
</telerik:RadPane>
<telerik:RadSplitBar ID="RadSplitBar4" runat="server" Visible="false"></telerik:RadSplitBar>
<telerik:RadPane ID="RadPaneSys" runat="server" Scrolling="Both" Height="100%">
<div style="width: 95%; margin-left: auto; margin-right: auto;">
</div>
</telerik:RadPane>
</telerik:RadSplitter>
</telerik:RadPane>
</telerik:RadSplitter>
</asp:Content>

Splitter

answered on 25 Apr 2014

4 answers

212 views

Grid Exporting to Excel

Hello.
i have this issue, i have a RadGrid i populate with then event NeedDataSource, then i change some value of cells with the event ItemDataBound, but when i want to export the grid only export the columns that i fill wih NeedDataSource event.
is there a way to put also the other columns that i have modify with ItemDataBound

thanks in advance.
Hector

Grid

answered on 25 Apr 2014

1 answer

70 views

command with template can't firing event!

                {
                    command: [{ name: "delete1", click: deleteItem }], title: " ", width: 100
                },
                {
                    command: [{ name: "delete2", click: deleteItem, template: "<div class='btn-link'><span class='glyphicon glyphicon-remove'></span></div>" }], title: " ", width: 100
                }

function deleteItem(e) {
            var dataItem = this.dataItem($(e.currentTarget).closest("tr"));            if (confirm('are yousure : ' + dataItem.Name)) {
               ...
            }
        }

my problem is delete1 command work fine , but delete2 command can't firing the deleteItem event, any one can help me? thanks!

Grid

answered on 25 Apr 2014

6 answers

144 views

Creating columns dynamically fails.

Hello,
I tried to create the columns on the radgrid dynamically on Page_load (I can't create them on page_init)
I followed the instructions on your site but I keep getting the following error after each postback once the grid is created:

[GridException: Cannot find a column with UniqueName 'alert_id']
   Telerik.Web.UI.GridTableView.GetColumn(String columnUniqueName) +102
   Telerik.Web.UI.RadGrid.LoadClientState(Dictionary`2 clientState) +5156
   Telerik.Web.UI.RadCompositeDataBoundControl.LoadPostData(String postDataKey, NameValueCollection postCollection) +109
   Telerik.Web.UI.RadCompositeDataBoundControl.System.Web.UI.IPostBackDataHandler.LoadPostData(String postDataKey, NameValueCollection postCollection) +13
   System.Web.UI.Page.ProcessPostData(NameValueCollection postData, Boolean fBeforeLoad) +690
   System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +1743

I added the bound-columns to the mastertable before I set their properties.

The grid is created once, but each postback throws this error.
The error occures even before "Page_Load" happens.

My main goal is to add a button to the header which will open a custom context menu (so I can't use auto-generate-columns) and still have all the functionalities of group-by/sort/reorder etc. also, the grid's columns should be created dynamically since the datasource is set during run-time and I don't know what are its columns at design time - The grid is inside a RadTabStrip and each tab-click sets a different data source into the grid

Grid

answered on 25 Apr 2014

1 answer

122 views

Add custom column in Image Manager (FileBrowser)

I'm looking for a way to change the columns in the Image Manager. I use already the FileBrowser.ascx from the EditorDialogs folder. The problem is that there is only a ascx page and no code behind were I can change the default behaviour.
In the FileBrowser.ascx it looks like this (default):

<telerik:RadFileExplorer ID="RadFileExplorer1" Height="450px" Width="400px" TreePaneWidth="150px"

runat="Server" EnableOpenFile="false" AllowPaging="true" PageSize="100" />

The default columns are now Filename and Size, but I would also like to show the Title field from the Image library.

Is it possible to replace this with a custom class that has the RadFileExplorer as a base class? Or is it possible to change/add columns via JavaScript?

WebParts for SharePoint

answered on 25 Apr 2014