Questions on UI for ASP.NET AJAX Forum

1 answer

67 views

asking help about creating grid.

Hi. I need a grid like below image. How can I make this grid? cAn anyone give me an idea?
Thanks in advance.

Grid

answered on 11 Jan 2014

1 answer

109 views

How do I access RadNumericTextBox in footer template, from Server side?

I have no clue why, but this code was working yesterday and today it doesn't.

I have the following grid:

<telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging="True" DataSourceID="Products"

Skin="Forest" GridLines="None" OnItemDataBound="RadGrid1_ItemDataBound" Width="50%">

<ClientSettings>

<Scrolling AllowScroll="True" UseStaticHeaders="True" SaveScrollPosition="true" ></Scrolling>

<ClientEvents OnBatchEditCellValueChanged="CellValueChanged" />

</ClientSettings>

<MasterTableView ShowFooter="true" AutoGenerateColumns="False"

CurrentResetPageIndexAction="SetPageIndexToFirst" DataKeyNames="ID" DataSourceID="Products"

Dir="LTR" Frame="Border" TableLayout="Auto" EditMode="Batch" BatchEditingSettings-OpenEditingEvent="Click" CommandItemDisplay="None">

<Columns>

<telerik:GridBoundColumn DataField="ID" DataType="System.Int32" ReadOnly="True" UniqueName="ID" />

<telerik:GridBoundColumn DataField="ProductName" ReadOnly="true" HeaderText="Product" UniqueName="ProductName" />

<telerik:GridTemplateColumn DataField="Quantity" UniqueName="Quantity" HeaderText="Quantity" DataType="System.Int32">

<ItemTemplate>

<%# Eval("Quantity")%>

</ItemTemplate>

<EditItemTemplate>

<telerik:RadNumericTextBox ID="txtQuantity" runat="server" Width="40px" DataType="System.Int32"

NumberFormat-DecimalDigits="0" Skin="Forest">

<ClientEvents OnBlur="Blur" OnFocus="Focus" />

</telerik:RadNumericTextBox>

</EditItemTemplate>

<FooterTemplate>

<telerik:RadNumericTextBox ID="TextBox2" runat="server" Width="40px" DataType="System.Int32" NumberFormat-DecimalDigits="0" Skin="Forest" ReadOnly="True">

<ClientEvents OnLoad="Load" />

</telerik:RadNumericTextBox>

</FooterTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

<PagerStyle Mode="NextPrevAndNumeric" />

</telerik:RadGrid>

With the following javascript:

<telerik:RadScriptBlock runat="server" ID="RadScriptBlock1">

<script type="text/javascript">

var sumInput = null;

var tempValue = 0;

function Load(sender, args) {

sumInput = sender;

}

function Blur(sender, args) {

sumInput.set_value(tempValue + sender.get_value());

}

function Focus(sender, args) {

tempValue = sumInput.get_value() - sender.get_value();

}

function CellValueChanged(sender, args) {

var row = args.get_row();

var rowIndex = row.rowIndex;

var columnName = args.get_columnUniqueName();

var cell = args.get_cell();

var oldValue = args.get_cellValue();

var newValue = '' + args.get_editorValue();

var key = '' + row.cells[0].textContent

//debugger

var hc = document.getElementById('<%= ProductHash.ClientID%>');

if (hc.value == '') {

if (newValue == "0") {

return;

}

aProducts = new Array();

aProducts[key] = newValue;

}

else {

var aProducts = JSON.parse(hc.value);

if (aProducts == null) {

if (newValue == "0") {

return;

}

aProducts = new Array();

aProducts[key] = newValue;

}

else {

aProducts[key] = newValue;

}

hc.value = JSON.stringify(aProducts);

}

</script>

</telerik:RadScriptBlock>

And the following server side code:

Protected Sub btnProcess_Click(sender As Object, e As EventArgs)

Try

'Retrieve total quantity from footer

Dim footer As GridFooterItem = DirectCast(RadGrid1.MasterTableView.GetItems(GridItemType.Footer)(0), GridFooterItem)

Dim TotalQty As String = TryCast(footer.FindControl("TextBox2"), RadNumericTextBox).Text

.......do some stuff

Catch ex As Exception

Response.Write(ex.ToString)

End Try

End Sub

Yesterday, I was able to populate TotalQty with the value from the footer, but today, it is an empty string. The footer textbox shows a number in it. Server side, I am getting access to the footer textbox, but the Text property is an empty string.

I have no clue why it stopped working.

Grid

answered on 11 Jan 2014

1 answer

144 views

How can I populate a RadNumericTextBox in footer from Code Behind?

I have a RadNumericTextbox in the footer of a grid that I use for displaying a running total on a column when in edit mode.
I populate the grid depending upon what the user selects for input. When in edit mode, and they update the quantity column,
the textbox in the footer automatically totals that column.

When I display non-editable data in the grid, I need to be able to manually update the total from the code behind. How can I
gain access to the textbox and set it's value to be displayed?

I tried the following code but it doesn't work. I can access the textbox and set the text property, but it doesn't display.

I have tried this:

Dim footer As GridFooterItem = DirectCast(RadGrid1.MasterTableView.GetItems(GridItemType.Footer)(0), GridFooterItem)

Dim TotalQty As RadNumericTextBox = TryCast(footer.FindControl("TextBox2"), RadNumericTextBox)

TotalQty.Text = dr("TotalQuantity")

And, I have tried this:

Dim TotalQty As RadNumericTextBox = FindControlRecursive(Page, "TextBox2")

TotalQty.Text = dr("TotalQuantity")

This is the grid:

<telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging="True" DataSourceID="Products"

Skin="Forest" GridLines="None" OnItemDataBound="RadGrid1_ItemDataBound" Width="50%">

<ClientSettings>

<Scrolling AllowScroll="True" UseStaticHeaders="True" SaveScrollPosition="true" ></Scrolling>

<ClientEvents OnBatchEditCellValueChanged="CellValueChanged" />

</ClientSettings>

<MasterTableView ShowFooter="true" AutoGenerateColumns="False"

CurrentResetPageIndexAction="SetPageIndexToFirst" DataKeyNames="ID" DataSourceID="Products"

Dir="LTR" Frame="Border" TableLayout="Auto" EditMode="Batch" BatchEditingSettings-OpenEditingEvent="Click" CommandItemDisplay="None">

<Columns>

<telerik:GridBoundColumn DataField="ID" DataType="System.Int32" ReadOnly="True" UniqueName="ID" />

<telerik:GridBoundColumn DataField="ProductName" ReadOnly="true" HeaderText="Product" UniqueName="ProductName" />

<telerik:GridTemplateColumn DataField="Quantity" UniqueName="Quantity" HeaderText="Quantity" DataType="System.Int32">

<ItemTemplate>

<%# Eval("Quantity")%>

</ItemTemplate>

<EditItemTemplate>

<telerik:RadNumericTextBox ID="txtQuantity" runat="server" Width="40px" DataType="System.Int32"

NumberFormat-DecimalDigits="0" Skin="Forest">

<ClientEvents OnBlur="Blur" OnFocus="Focus" />

</telerik:RadNumericTextBox>

</EditItemTemplate>

<FooterTemplate>

<telerik:RadNumericTextBox ID="TextBox2" runat="server" Width="40px" DataType="System.Int32" NumberFormat-DecimalDigits="0" Skin="Forest" ReadOnly="True">

<ClientEvents OnLoad="Load" />

</telerik:RadNumericTextBox>

</FooterTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

<PagerStyle Mode="NextPrevAndNumeric" />

</telerik:RadGrid>

Grid

answered on 10 Jan 2014

0 answers

65 views

Website without Session Timeout

Hi,

I want to know that can I have a website without Session Timeout?
Is it possible to make this?

If you any come to know this,please let me know.

Thanking you,

AGMRAJA

General Discussions

asked on 10 Jan 2014

2 answers

195 views

Sorting groups numerically

I'm working on a grid that implements the grouping functionality and we are having an issue when attempting to sort the groups ascending or descending. The grouping field is an item number and needs to be sorting by value, however we can't seem to get it to not sort alphabetically (Item 10 always comes before Item 2). The associated column is an integer, so ideally it should sort numerically.

Is it possible to sort by just the group's value and not the formatted string? We currently have it formatted as "Item #", however we can strip any extra characters if necessary.

<telerik:RadGrid SkinID="Paging" ID="ResultsGrid" runat="server" AllowCustomPaging = "True" AllowPaging="False"

OnInit="DataGridInit" OnItemDataBound="BindColumnValues"

OnNeedDataSource="DataGrid_NeedDataSource"

OnItemCreated="ItemManipulation"

OnSortCommand="PerformSort"

OnItemCommand="ResultsGridItemCommand" ShowGroupPanel="true" AutoGenerateColumns="false"

GridLines="none" ShowFooter="false" EnableLinqExpressions="false">

<PagerStyle Mode="NextPrevNumericAndAdvanced"></PagerStyle>

<GroupingSettings ExpandTooltip="Expand" CollapseTooltip="Collapse" />

<MasterTableView Summary="<%$ Resources: ResultsTableSummary %>" ShowGroupFooter="true"

ClientDataKeyNames=""

DataKeyNames="ItemDocumentKey,FundingKey" CssClass="rgWrapFalse">

<Columns>

<telerik:GridBoundColumn UniqueName="ItemNumber" DataField="ItemNumber" HeaderText="<%$

Resources: PostAwardCommon, ItemNumber %>" DataType="System.Int32"

Visible="false"/>

<telerik:GridBoundColumn UniqueName="ShipToCode" DataField="ShipToCode" HeaderText="<%$ Resources: Common, DeliverTo %>" DataType="System.String"

SortExpression="ShipToCode" />

<telerik:GridBoundColumn DataField="AccountId"

HeaderText="<%$ Resources: PostAwardCommon, AccountId %>" UniqueName="AccountId" AllowSorting="true"/>

<telerik:GridBoundColumn DataField="AccountCode"

HeaderText="<%$ Resources: PostAwardCommon, AccountingCode %>" UniqueName="AccountCode" AllowSorting="true"/>

<telerik:GridBoundColumn DataField="AwardedAmount" HeaderText="<%$ Resources: PostAwardCommon, Awarded %>" AllowSorting="true"

UniqueName="AwardedAmount" HeaderStyle-CssClass="rgHeader width30 rgHeaderAlignLeft" ItemStyle-HorizontalAlign="Right"/>

<telerik:GridBoundColumn DataField="AcceptedToDate" HeaderText="<%$ Resources: PostAwardCommon, AcceptedtoDateHeaderText %>" AllowSorting="true"

UniqueName="AcceptedToDate" HeaderStyle-CssClass="rgHeader width45 rgHeaderAlignLeft" ItemStyle-HorizontalAlign="Right"/>

<telerik:GridBoundColumn DataField="RemainingAmount" HeaderText="<%$ Resources: PostAwardCommon, Remaining %>" AllowSorting="true"

UniqueName="RemainingAmount" HeaderStyle-CssClass="rgHeader width30 rgHeaderAlignLeft" ItemStyle-HorizontalAlign="Right"/>

<telerik:GridBoundColumn UniqueName="AcceptedDate" HeaderText="<%$ Resources: PostAwardCommon, ActualAcceptedDate %>"

ItemStyle-HorizontalAlign="Center" />

<telerik:GridBoundColumn UniqueName="AcceptedAmount" FooterStyle-HorizontalAlign="Left" FooterText="Total Accepted: "

GroupByExpression="AcceptedAmount Group By AcceptedAmount" DataType="System.Double" Aggregate="Sum" DataField="AcceptedAmount"

ItemStyle-HorizontalAlign="Right"/>

</Columns>

<GroupByExpressions>

<telerik:GridGroupByExpression>

<SelectFields>

<telerik:GridGroupByField FieldAlias="ItemNumber" HeaderText="<%$ Resources: PostAwardCommon, ItemNumber %>" FieldName="ItemNumber"></telerik:GridGroupByField>

</SelectFields>

<GroupByFields>

<telerik:GridGroupByField FieldName="ItemNumber" SortOrder="Ascending"></telerik:GridGroupByField>

</GroupByFields>

</telerik:GridGroupByExpression>

</GroupByExpressions>

</MasterTableView>

</telerik:RadGrid>

Grid

answered on 10 Jan 2014

2 answers

99 views

RadComboBox Skin Artifacts

when changing skins my radcombobox's are drawn with a line under them?? (see attached image)

metro and metro touch skins are rendered properly but skins like outlook, sunset have the extra line.

???

ComboBox

answered on 10 Jan 2014

8 answers

449 views

Default Table Style in RadEditor

Hi,
We want to have the default style for tables set to style="border: 1px solid black;". We know how to attain this from manipulating the stylesheet, but this will not add the tag to HTML mode. So when storing to the DB it will not store the border properties, and when retrieving the data for a report it will not have any borders.

We are now using OnClientCommandExecuting and OnClientCommandExecuted to manipulate the table border formatting. But this way of doing it is causing our pages with many radeditor controls to load extremely slow.

Code used for JS function call manipulation;

    
                    <telerik:RadEditor  
        
                            ID="RadEditor1"  
        
                            runat="server" 
        
                            Width="100%" 
        
                            ToolsFile="../RadControls/Editor/BasicTools.xml"  
        
                            skin="Vista" 
        
                            EditModes="Design"  
        
                            EnableResize="False" 
        
                            EnableTheming="True" 
        
                            StripFormattingOptions="AllExceptNewLines" 
        
                            ToolbarMode="Default" 
        
                            OnClientCommandExecuting="OnClientCommandExecuting"  
        
                            OnClientCommandExecuted="OnClientCommandExecuted">  
        
                    </telerik:RadEditor>

    
            var curTables = []; 
        
            var curTds = []; 
        
                        function IsObjectInArray(elem, array) 
        
                        { 
        
                            if (!array || !array.length) return false; 
        
                            for (var i=0; i < array.length; i++) 
        
                            { 
        
                                if (elem == array[i]) return true; 
        
                            } 
        
                            return false; 
        
                        } 
        
                        function OnClientCommandExecuting(editor, args) { 
        
                            var commandName = args.get_commandName(); 
        
                            if ("InsertTable" == commandName) { 
        
                                var cArea = editor.get_contentArea(); 
        
                                var tables = cArea.getElementsByTagName("TABLE"); 
        
                                var tds = cArea.getElementsByTagName("TD"); 
        
                                for (var i = 0; i < tables.length; i++) { 
        
                                    curTables[curTables.length] = tables[i]; 
        
                                } 
        
                                for (var j = 0; j < tds.length; j++) { 
        
                                    curTds[curTds.length] = tds[j]; 
        
                                } 
        
                            } 
        
                        } 
        
                        function OnClientCommandExecuted(editor, args) { 
        
                            var commandName = args.get_commandName(); 
        
                            if ("InsertTable" == commandName) { 
        
                                var cArea = editor.get_contentArea(); 
        
                                var tables = cArea.getElementsByTagName("TABLE"); 
        
                                var tds = cArea.getElementsByTagName("TD"); 
        
                                for (var i = 0; i < tables.length; i++) { 
        
                                    var oTable = tables[i]; 
        
                                    if (!IsObjectInArray(oTable, curTables)) { 
        
                                        oTable.style.borderCollapse = "collapse"; 
        
                                        oTable.style.border = "Black 1px solid"; 
        
                                        oTable.style.width = "100%"; 
        
                                    } 
        
                                } 
        
                                for (var j = 0; j < tds.length; j++) { 
        
                                    var oTd = tds[j]; 
        
                                    if (!IsObjectInArray(oTd, curTds)) { 
        
                                        oTd.style.border = "1px solid black"; 
        
                                    } 
        
                                } 
        
                            } 
        
                        }

Is there any other way of attaining the desired behaviour?

Editor

answered on 10 Jan 2014

5 answers

99 views

Rad Ajax version control concerns

Just thought I should check to make sure.

I have rather conservative managers and they've been resisting upgrades to our current version of the Rad Ajax controls. (We're currently using 2012.2.607.40.) I, of course, am getting impatient and would like to try the latest.

It occurs to me that the way our apps are designed, this should not be a problem. All references to the Telerik controls are to copies of the DLL located in the project itself, not to the originals located in the c:\program files (x86) folder.

Just wondering if downloading the latest version would have any affect on this project?

Any factor I might be overlooking?

General Discussions

answered on 10 Jan 2014

3 answers

101 views

Radwindow Lightweight Lost Focus

If I open 2 radwindows, after closing the second one, the focus don't go back to the first one. This issue is only in Lightweight rendering.
I attached a snapshot demonstrating the problem.

Window

answered on 10 Jan 2014

3 answers

110 views

RadGrid doesn't support TemplateColumn while Binding to DataTable

A page uses a RadGrid :
1. DataBind to a DataTable.(on Page_Load)
2. GridTemplateColumn , put a RadTextBox (in .aspx file)

no compile warning or errors, run in IE, the grid in displayed very strange.
snapshot pic is here: http://i.imgbox.com/abhkG4MO.png

codes:
1. WebForm1.aspx

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

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

<!DOCTYPE html>

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

<head runat="server">

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

<title></title>

</head>

<body>

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

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