Questions on UI for ASP.NET AJAX Forum

1 answer

117 views

Width & Height not reflecting in RadWindow

Hi,

We are using telerik version 2011.1.413.35. The width & height of Radwindow doesnt get reflected in many places. I have also width and height property in cssclass with '!important' specified in class even though it is not getting reflected.. I guess it its takes its default size. the following code i have used,

<telerik:RadWindowManager ID="RadWindowManager2" runat="server" ReloadOnShow="false"

OnClientShow="">

<Windows>

<telerik:RadWindow ID="radWindowAccountCodePopup" Behavior="Close" VisibleTitlebar="false"

Modal="true" Width="578px" runat="server" Height="450px" NavigateUrl="~\Admin\AccountCodePopup.aspx"

VisibleStatusbar="false">

</telerik:RadWindow>

<telerik:RadWindow ID="radWindowAddDescriptionPopup" Behavior="Close" VisibleTitlebar="false"

Modal="true" Width="750px" runat="server" Height="550px" NavigateUrl="~\Admin\ClassDescriptionPopup.aspx"

VisibleStatusbar="false">

</telerik:RadWindow>

<telerik:RadWindow ID="radWindowThumbNailFileUploadPopup" Behavior="Close" VisibleTitlebar="false"

Modal="true" Width="750px" runat="server" OnClientClose="CallBackFunctionService"

Height="300px" NavigateUrl="~/Admin/ImageUpload.aspx" VisibleStatusbar="false">

</telerik:RadWindow>

<telerik:RadWindow ID="radWindowLargeFileUploadPopup" Behavior="Close" VisibleTitlebar="false"

Modal="true" OnClientClose="CallBackFunctionService" Width="750px" Height="300px"

NavigateUrl="~/Admin/ImageUpload.aspx" runat="server" VisibleStatusbar="false">

</telerik:RadWindow>

<telerik:RadWindow ID="radWindowOpenCancelClassPopup" Behavior="Close" VisibleTitlebar="false"

Modal="true" Width="750px" runat="server" Height="600px" NavigateUrl="~/Admin/CancelClass.aspx"

VisibleStatusbar="false">

</telerik:RadWindow>

</Windows>

</telerik:RadWindowManager>

Please guide me..

Thanks,
Hema.

Window

answered on 10 May 2011

5 answers

128 views

RadGrid NestedViewTemplate vs RadBinaryImage

Hello,
I have created a telerik radgrid that displays info from an SQL Server database.
Inside my grid, i edited a nested view template and inside that template I placed a RadBinary image of which datavalue is set a binary field in the SQL table. The problem is that the picture is not showing.
Can someone tell me if there is some conflict or some additional steps to take when setting up a binary image in the nested view template.

Arnaud

Grid

answered on 10 May 2011

1 answer

157 views

Nested Radgrid missing 2 imporant images when not using default skin

Hello:

Hopefully you can help us with a perplexing problem we are having.

We started developing a major application for our organization using your Controls for AJAX.NET in early 2008. We used the Outlook skin to render these controls.

In one of your subsequent releases which we upgraded to, you made some substantial revisions to the outlook skin. These revisions were incompatible with our application and caused many of your controls to render incorrectly. Because of this we had to revert to an earlier version of your controls.

Eventually you provided us with a series of articles from your ‘knowledge base’ which addressed this and other issues that had cropped up for us. One of the articles was written (I believe) by Mr. Todd Anglin in mid 2008 on blogs.Telerik.com and explained how to create a separate solution which contained legacy versions of the skins. Our Solution was called TelerikCustomSkins.

This revision rendered the Radgrids, Radeditors and RadComboBoxes correctly, with one small but serious problem.

Our nested Radgrids do not render the image that allows the user to open and close the nested grid. If the user realizes where the image is located he can still click there and open the nested grid, but we need to show the image.

The RadGrid has an attribute named EnableEmbeddedSkins which we have set to false, a setting that is required for using the revised skins. With the setting at false, the radgrids redner without the images as mentioned above. However if we change the setting of EnableEmbeddedSkins to true (or remove it altogether) the radgrid is rendered using your new skin the missing images now appear.

We find 2 gif images named ‘SingleMinus.gif’ and ‘SinglePlus.gif’ which represent the two missing images. We believe, however, that the css file is set up to obtain the images from a portion of a gif entitled sprties.gif.

This solution contained the following c# main module:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.UI;

[assembly: WebResource("TelerikCustomSkins.OutlookSkinForComboBox.css", "text/css")]
//[assembly: WebResource("TelerikCustomSkins.OutlookSkinForGrid.css", "text/css")]
[assembly: WebResource("TelerikCustomSkins.OutlookSkinForEditor.css", "text/css")]
[assembly: WebResource("TelerikCustomSkins.OutlookSkinForGridClassic.css", "text/css")]

[assembly: WebResource("TelerikCustomSkins.ComboBox_Images.rcbSprite.png", "image/png")]
[assembly: WebResource("TelerikCustomSkins.ComboBox_Images.rcbSpriteIE6.png", "image/png")]
[assembly: WebResource("TelerikCustomSkins.ComboBox_Images.Outlook.gif", "image/gif")]

//[assembly: WebResource("TelerikCustomSkins.Grid_Images.AddRecord.gif",        "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.Cancel.gif",           "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.Delete.gif",           "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.Edit.gif",             "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.Filter.gif",           "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.MoveDown.gif",         "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.MoveUp.gif",           "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.Outlook.gif",          "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.PagingFirst.gif",      "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.PagingLast.gif",       "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.PagingNext.gif",       "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.PagingPrev.gif",       "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.SingleMinus.gif",      "image/gif")]
/[assembly: WebResource("TelerikCustomSkins.Grid_Images.SinglePlus.gif",       "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.SortAsc.gif",          "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.SortDesc.gif",         "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.Sprite.gif",           "image/gif")]
//[assembly: WebResource("TelerikCustomSkins.Grid_Images.Update.gif",           "image/gif")]

[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.AddRecord.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.Cancel.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.Delete.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.Edit.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.Filter.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.MoveDown.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.MoveUp.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.Outlook.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.PagingFirst.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.PagingLast.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.PagingNext.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.PagingPrev.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.Refresh.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.SingleMinus.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.SinglePlus.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.SortAsc.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.SortDesc.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.Sprite.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.Update.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.export.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.loading_small.gif", "image/gif")]

[assembly: WebResource("TelerikCustomSkins.Editor_Images.CommandSpritesLight.png",    "image/png")]
[assembly: WebResource("TelerikCustomSkins.Editor_Images.CommandSpritesLightIE6.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.Editor_Images.CommonIcons.gif",            "image/gif")]
[assembly: WebResource("TelerikCustomSkins.Editor_Images.LoadingSpell.gif",           "image/gif")]
[assembly: WebResource("TelerikCustomSkins.Editor_Images.Outlook.gif",                "image/gif")]
[assembly: WebResource("TelerikCustomSkins.Editor_Images.ToolbarSprites.gif",         "image/gif")]
[assembly: WebResource("TelerikCustomSkins.Editor_Images.ToolbarVerticalSprites.gif", "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.export.gif",                 "image/gif")]
[assembly: WebResource("TelerikCustomSkins.GridClassic_Images.loading_small.gif", "image/gif")]
namespace TelerikCustomSkins
{

public class TelerikSkin
{

}

This is the css file from the new solution that renders the Radgrid without the images:

/* Telerik RadGrid Outlook Skin */

/*global*/

.RadGrid_Outlook

{

border:1px solid #002d96;

background:Window;

color:WindowText;

}

.RadGrid_Outlook,

.RadGrid_Outlook .rgMasterTable,

.RadGrid_Outlook .rgDetailTable,

.RadGrid_Outlook .rgGroupPanel table,

.RadGrid_Outlook .rgCommandRow table,

.RadGrid_Outlook .rgEditForm table,

.GridToolTip_Outlook

{

font:11px tahoma,verdana,sans-serif;

}

.RadGrid_Outlook .rgMasterTable,

.RadGrid_Outlook .rgDetailTable

{

border-collapse:separate;

}

.RadGrid_Outlook .rgRow td,

.RadGrid_Outlook .rgAltRow td,

.RadGrid_Outlook .rgEditRow td,

.RadGrid_Outlook .rgFooter td,

.RadGrid_Outlook .rgFilterRow td,

.RadGrid_Outlook .rgGroupHeader td

{

padding-left:4px;

padding-right:4px;

}

.RadGrid_Outlook .rgAdd,

.RadGrid_Outlook .rgRefresh,

.RadGrid_Outlook .rgEdit,

.RadGrid_Outlook .rgDel,

.RadGrid_Outlook .rgFilter,

.RadGrid_Outlook .rgPagePrev,

.RadGrid_Outlook .rgPageNext,

.RadGrid_Outlook .rgPageFirst,

.RadGrid_Outlook .rgPageLast,

.RadGrid_Outlook .rgExpand,

.RadGrid_Outlook .rgCollapse,

.RadGrid_Outlook .rgSortAsc,

.RadGrid_Outlook .rgSortDesc,

.RadGrid_Outlook .rgUpdate,

.RadGrid_Outlook .rgCancel

{

width:16px;

height:16px;

border:0;

padding:0;

background-color:transparent;

background-image:url('<%=WebResource("TelerikCustomSkins.GridClassic_Images.sprite.gif")%>');

background-repeat:no-repeat;

vertical-align:middle;

font-size:1px;

cursor:pointer;

}

.RadGrid_Outlook .rgGroupItem input,

.RadGrid_Outlook .rgCommandRow img,

.RadGrid_Outlook .rgHeader input,

.RadGrid_Outlook .rgFilterRow img,

.RadGrid_Outlook .rgPager img

{

vertical-align:middle;

}

/*header*/

.RadGrid_Outlook .rgHeaderDiv

{

background:#f6f6f6 url('<%=WebResource("TelerikCustomSkins.GridClassic_Images.sprite.gif")%>') 0 -716px repeat-x;

}

.RadGrid_Outlook .rgHeader,

.RadGrid_Outlook th.rgResizeCol

{

border:1px solid;

border-color:#f2f0ee #75736e #75736e #f2f0ee;

background:ButtonFace;

padding:3px;

font-weight:normal;

text-align:left;

}

.RadGrid_Outlook .rgHeader,

.RadGrid_Outlook .rgHeader a

{

color:WindowText;

text-decoration:none;

}

.RadGrid_Outlook th.rgResizeCol

{

background:ButtonFace url('<%=WebResource("TelerikCustomSkins.GridClassic_Images.sprite.gif")%>') center -199px no-repeat;

}

/*rows*/

.RadGrid_Outlook .rgRow td,

.RadGrid_Outlook .rgAltRow td,

.RadGrid_Outlook .rgEditRow td,

.RadGrid_Outlook .rgFooter td

{

padding-top:3px;

padding-bottom:3px;

}

.RadGrid_Outlook .rgRow td,

.RadGrid_Outlook .rgAltRow td,

.RadGrid_Outlook .rgFooter td

{

border-top:1px solid #fff;

border-bottom:1px solid #eae9e1;

}

.RadGrid_Outlook .rgRow a,

.RadGrid_Outlook .rgAltRow a,

.RadGrid_Outlook .rgEditRow a,

.RadGrid_Outlook .rgFooter a,

.RadGrid_Outlook .rgEditForm a

{

color:WindowText;

}

.RadGrid_Outlook .rgSelectedRow

{

background:Highlight;

}

.RadGrid_Outlook .rgSelectedRow,

.RadGrid_Outlook .rgSelectedRow a

{

color:HighlightText;

}

.RadGrid_Outlook .rgSelectedRow td

{

border-color:Highlight;

}

.RadGrid_Outlook .rgHoveredRow,

.RadGrid_Outlook .rgActiveRow

{

background:InfoBackground;

color:InfoText;

}

.RadGrid_Outlook .rgEditRow

{

background:Menu;

color:MenuText;

}

.RadGrid_Outlook .rgEditRow td

{

border-color:Menu;

}

/*footer*/

.RadGrid_Outlook .rgFooterDiv,

.RadGrid_Outlook .rgFooter

{

background:#f6f6f6;

color:#333;

}

/*status*/

.RadGrid_Outlook .rgPager .rgStatus

{

width:35px;

border-right:1px solid #808080;

padding:3px 0 2px;

}

.RadGrid_Outlook .rgPager .rgStatus div

{

width:24px;

height:24px;

overflow:hidden;

border:0;

margin:0 auto;

padding:0;

background:transparent;

text-indent:-2222px;

}

/*pager*/

.RadGrid_Outlook .rgPager

{

background:ButtonFace;

line-height:20px;

}

.RadGrid_Outlook .rgPager td

{

padding:0;

}

.RadGrid_Outlook .rgPagePrev

{

background-position:5px -388px;

}

.RadGrid_Outlook .rgPageNext

{

background-position:-21px -388px;

}

.RadGrid_Outlook .rgPageFirst

{

background-position:4px -356px;

}

.RadGrid_Outlook .rgPageLast

{

background-position:-20px -356px;

}

.RadGrid_Outlook .rgWrap

{

float:left;

padding:0 10px;

line-height:26px;

white-space:nowrap;

}

.RadGrid_Outlook .rgArrPart1

{

padding-right:0;

line-height:22px;

}

.RadGrid_Outlook .rgArrPart2

{

padding-left:0;

line-height:22px;

}

.RadGrid_Outlook .rgInfoPart

{

float:right;

}

.RadGrid_Outlook .rgInfoPart strong

{

font-weight:normal;

}

.RadGrid_Outlook .rgPageFirst,

.RadGrid_Outlook .rgPagePrev,

.RadGrid_Outlook .rgPageNext,

.RadGrid_Outlook .rgPageLast

{

height:24px;

}

.RadGrid_Outlook .rgPagerButton

{

height:22px;

border:1px solid #b0b0b0;

margin:0 14px 0 0;

padding:0 4px 2px;

background:#d8d8d8;

color:#000;

font:12px/12px arial,sans-serif;

vertical-align:middle;

cursor:pointer;

}

.RadGrid_Outlook .rgNumPart

{

padding:2px 0;

}

.RadGrid_Outlook .NumericPages .rgNumPart

{

padding:2px 10px;

}

.RadGrid_Outlook .rgNumPart a

{

float:left;

line-height:22px;

margin:0;

padding:0 5px 0 0;

color:#000;

text-decoration:none;

}

.RadGrid_Outlook .rgNumPart span

{

float:left;

padding:0 0 0 5px;

}

.RadGrid_Outlook .rgNumPart a:hover

{

text-decoration:underline;

}

.RadGrid_Outlook .rgNumPart a:hover span

{

cursor:pointer;

}

.RadGrid_Outlook .rgNumPart a.rgCurrentPage,

.RadGrid_Outlook .rgNumPart a.rgCurrentPage:hover

{

cursor:default;

text-decoration:none;

font-weight:bold;

}

.RadGrid_Outlook .rgNumPart a.rgCurrentPage span,

.RadGrid_Outlook .rgNumPart a.rgCurrentPage:hover span

{

cursor:default;

}

.RadGrid_Outlook .NextPrevNumericAndAdvanced .rgAdvPart

{

float:none;

text-align:center;

}

.RadGrid_Outlook .rgPager .RadSlider

{

float:left;

margin:2px 10px 0 0;

}

.RadGrid_Outlook .rgPagerLabel,

.RadGrid_Outlook .rgPager .RadComboBox,

.RadGrid_Outlook .rgPager .RadInput_Outlook

{

margin:0 4px 0 0;

vertical-align:middle;

}

.RadGrid_Outlook .rgPager .RadComboBox

{

margin-top:-1px;

}

*+html .RadGrid_Outlook .rgPager .RadComboBox{margin-top:-2px;}

* html .RadGrid_Outlook .rgPager .RadComboBox{margin-top:-2px;}

.RadGrid_Outlook .rgPagerTextBox

{

text-align:center;

}

/*sorting, reordering*/

.RadGrid_Outlook .rgHeader .rgSortAsc

{

background-position:-21px -330px;

height:10px;

}

.RadGrid_Outlook .rgHeader .rgSortDesc

{

background-position:5px -328px;

height:10px;

}

.GridReorderTop_Outlook,

.GridReorderBottom_Outlook

{

width:9px !important;

height:12px !important;

margin-left:-4px;

background:url('<%=WebResource("TelerikCustomSkins.GridClassic_Images.sprite.gif")%>') 0 -300px no-repeat;

}

.GridReorderBottom_Outlook

{

background-position:-23px -300px;

}

/*filtering*/

.RadGrid_Outlook .rgFilterRow

{

background:#f6f6f6;

}

.RadGrid_Outlook .rgFilterRow td

{

border-bottom:1px solid #eae9e1;

padding-top:4px;

padding-bottom:4px;

}

.RadGrid_Outlook .rgFilter

{

background-position:2px -424px;

}

.RadGrid_Outlook .rgFilterBox

{

border:1px solid ButtonFace;

padding:2px;

background:Window;

font:11px arial,sans-serif;

color:WindowText;

vertical-align:middle;

}

/*grouping*/

.RadGrid_Outlook .rgGroupPanel

{

background:#043994 url('<%=WebResource("TelerikCustomSkins.GridClassic_Images.sprite.gif")%>') 0 0 repeat-x;

color:#fff;

}

.RadGrid_Outlook .rgGroupPanel .rgSortAsc

{

background-position:-21px -327px;

}

.RadGrid_Outlook .rgGroupPanel .rgSortDesc

{

background-position:5px -326px;

}

.RadGrid_Outlook .rgGroupPanel td

{

padding:3px 4px 5px;

}

.RadGrid_Outlook .rgGroupPanel td td

{

padding:1px;

}

.RadGrid_Outlook .rgGroupItem

{

white-space:nowrap;

}

.RadGrid_Outlook .rgGroupHeader

{

background:#fff;

}

.RadGrid_Outlook .rgGroupHeader td

{

border-bottom:2px solid #7ba4e0;

padding:4px 4px;

color:#3768b9;

font-weight:bold;

}

.RadGrid_Outlook .rgExpand

{

background-position:2px -457px;

}

.RadGrid_Outlook .rgCollapse

{

background-position:2px -489px;

}

.RadGrid_Outlook .rgGroupHeader td div

{

top:-0.5em;

}

.RadGrid_Outlook .rgGroupHeader td div div

{

top:0;

}

/*editing*/

.RadGrid_Outlook .rgEditForm

{

border-bottom:1px solid #7ba4e0;

}

.RadGrid_Outlook .rgUpdate

{

background-position:2px -618px;

}

.RadGrid_Outlook .rgCancel

{

background-position:2px -650px;

}

/*hierarchy*/

.RadGrid_Outlook .rgDetailTable

{

border:1px solid #002d96;

border-right:0;

}

/*command row*/

.RadGrid_Outlook .rgCommandRow

{

background:#f6f6f6;

}

.RadGrid_Outlook .rgCommandRow a

{

color:#000;

}

.RadGrid_Outlook .rgAdd

{

background-position:2px -683px;

}

.RadGrid_Outlook .rgRefresh

{

background-position:5px -521px;

}

.RadGrid_Outlook .rgEdit

{

background-position:2px -554px;

}

.RadGrid_Outlook .rgDel

{

background-position:2px -587px;

}

/*multirow select*/

.GridRowSelector_Outlook

{

background:#003;

}

/*row drag n drop*/

.GridItemDropIndicator_Outlook

{

border-top:1px dashed #666;

}

/*tooltip*/

.GridToolTip_Outlook

{

border:1px solid #000;

padding:3px;

background:#ffffe1;

color:#000;

}

/*rtl*/

.RadGridRTL_Outlook .rgHeader,

.RadGridRTL_Outlook th.rgResizeCol

{

text-align:right;

}

.RadGridRTL_Outlook .rgWrap

{

float:right;

}

.RadGridRTL_Outlook .rgInfoPart
float:left;

}

.RadGridRTL_Outlook .rgNumPart

{

width:220px;

}

.RadGridRTL_Outlook .rgNumPart a

{

float:right;

}

To use the revised skins in the mina project we needed to add the following code to our Master Page:

<telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server">

<telerik:StyleSheetReference Name="TelerikCustomSkins.OutlookSkinForComboBox.css"

Assembly="TelerikCustomSkins"></telerik:StyleSheetReference>

<telerik:StyleSheetReference Name="TelerikCustomSkins.OutlookSkinForGridClassic.css"

Assembly="TelerikCustomSkins"></telerik:StyleSheetReference>

<telerik:StyleSheetReference Name="TelerikCustomSkins.OutlookSkinForEditor.css"

Assembly="TelerikCustomSkins"></telerik:StyleSheetReference>

</StyleSheets>

</telerik:RadStyleSheetManager>

Your answer to our original problem works fine except for the two missing images in the nested RadGrids. Can you help us find a solution for this?

(I will also send you our copy of sprites.gif, which seems to be fine.)

Grid

answered on 10 May 2011

1 answer

68 views

Drag and Drop Will not work.

This is the code I'm using listed below. The version I'm using is 2010.3.1215.40

<%

@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="WebApplication2.WebForm1" %>

<%

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

<!

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<

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

<

head runat="server">

</

head>

<

body>

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

</telerik:RadScriptManager>

<telerik:RadListBox ID="RadListBox1" runat="server" Width="190px" Height="130px"

TransferToID="RadListBox2" AllowTransfer="true"

AutoPostBackOnTransfer="true" EnableDragAndDrop="true" AllowTransferOnDoubleClick="true">

<Items>

<telerik:RadListBoxItem Text="RadListBoxItem1" />

<telerik:RadListBoxItem Text="RadListBoxItem2" />

<telerik:RadListBoxItem Text="RadListBoxItem3" />

<telerik:RadListBoxItem Text="RadListBoxItem4" />

<telerik:RadListBoxItem Text="RadListBoxItem5" />

<telerik:RadListBoxItem Text="RadListBoxItem6" />

<telerik:RadListBoxItem Text="RadListBoxItem7" />

<telerik:RadListBoxItem Text="RadListBoxItem8" />

</Items>

</telerik:RadListBox>

<telerik:RadListBox ID="RadListBox2" runat="server" Width="190px" Height="130px">

</telerik:RadListBox>

</form>

</

body>

</

html>

ListBox

answered on 10 May 2011

1 answer

64 views

Telerik RadGrid Date column filtered by Number

Telerik Team,

I am using Telerik Grid and have Date column (using <telerik:GridBoundColumn) with DataFormatString="{0:MM/dd/yyyy}" and everything works fine. But when I enter number like 5 in the filter bar and select Equal To from filter criteria, an client side error appears. Error only comes in IE, other browsers like FF, Chrome and Safari don't respond at all and grid doesn't get filtered. I tried to debug and it say String is not valid DateTime. Please advise how do I handle this.

Thank you so much for any help.

Regards

Grid

answered on 10 May 2011

9 answers

274 views

Static Header bar and Scrolling style issue

When I have enabled scrolling and have a static header bar, there is a gap above the vertical scrollbar that displays the background color of my grid. (See whitegrid.png). Instead, I want it to display as if it was an extension of my header bar (see bggrid.png -- a doctored image). Or at the very least, change it to a different color -- the blue of the pager background and border. Is this possible, and how can I do it if it is?

If it matters, this particular grid is created dynamically in Page_Init, has virtual scrolling/paging enabled and uses a custom pager template.

Note that it is not possible for me to change my grid background color (which is white) to the color I want to display in the gap, since the grid background color also displays when I use virtual scrolling to scroll past the current page.

--Christina Noel

Grid

answered on 10 May 2011

3 answers

180 views

dynamically generated grid - sorting problems

In our website we have automatically generated grid. Basically on our .aspx we keep the radgrid declaration:

<telerik:RadGrid ID="rgAutoGrid" AllowSorting="true" DataSourceID="odsAuto"

runat="server" OnItemCreated="rgAutoGrid_ItemCreated" AllowPaging="true"

ShowFooter="true" AutoGenerateColumns="false" OnItemDataBound="rgAutoGrid_ItemDataBound" Skin="WebBlue" OnPageSizeChanged="Grid_SizeChanged"

OnSortCommand="rgAutoGrid_SortCommand">

<PagerStyle Mode="NextPrevAndNumeric" Position="TopAndBottom" AlwaysVisible="true" />

</telerik:RadGrid>

We populate that grid with columns inside odsAuto (ObjectDataSource)'s Selecting item. We discovered that we have to clear all the columns and add them again each time the selecting happens. If we won't do so then radgrid doesn't display data correctly - headers of grid have no captions and cell are either empty or contain "DataRowView" inside. Thanks to clearing and recreating columns inside Selecting event - paging for grid works. Unfortunately sorting fails. Data in cells are still displayed correctly in cells, but captions in headers disappear and there is no sorting applied to order inside grid. If you need any information - i'm willing to provide anything what's needed.

Grid

answered on 10 May 2011

5 answers

115 views

How to stop filckering problem in an RadAjaxManager control used?

Hello All,

I'm new to ASP.NET coding. I'm facing flickering problem on a page - actually, RadAjaxManager, is placed on the default page. Some more controls are added to the manager control dynamically based on the configuration of the application. (Actually, the control's ASP.NET tags are added using LiteralControl class). But, still the page flickers.

PLS find my code below:

public static void UpdatePageControl(string pageName, Panel body, Page page, bool isPostBack, Control placeholder, RadAjaxManager manager)

{

string connectionString = GetConnectionString(page);

SecurityToken token = new SessionData(page.Session).SecurityToken;

EventServiceClient proxy = new EventServiceClient();

using (proxy)

{

PageConfig pageConfig = proxy.GetPageConfiguration(token, pageName);

if (pageConfig == null)

{

log.DebugFormatCulture("Failed to load the page configuration for page '{0}'", pageName);

return;

}

// set title of page to first panels title if available

string pageTitle = pageConfig.Name;

if (pageConfig.Panels.Count > 0)

{

if (!string.IsNullOrEmpty(pageConfig.Panels[0].Title.Text))

{

pageTitle = pageConfig.Panels[0].Title.Text;

}

body.Page.Title = "{0} : {1}".FormatCulture(token.SessionInfo.Station, pageTitle);

foreach (PanelConfig panelConfig in pageConfig.Panels)

{

Panel gridPanel = new Panel { CssClass = "mainPanelWrapperStyle" };

if (panelConfig.Title != null)

{

if (!string.IsNullOrEmpty(panelConfig.Title.Text))

{

LabelControl title = new LabelControl(panelConfig);

title.AddControl(gridPanel);

}

placeholder.Controls.Add(gridPanel);

GridConfig gridConfig = panelConfig.Grid;

string gridClientId = string.Empty;

string gridId = string.Empty;

if (gridConfig != null)

{

Grid newGrid = new Grid(panelConfig);

RadGrid radGrid = newGrid.AddControl(body, connectionString, isPostBack, placeholder) as RadGrid;

if (radGrid != null)

{

gridClientId = radGrid.ClientID;

gridId = radGrid.ID;

}

manager.AjaxSettings.AddAjaxSetting(radGrid, radGrid);

}

if (panelConfig.Detail != null)

{

// Add details

Panel detailPanel = new Panel();

body.Controls.Add(detailPanel);

detailPanel.CssClass = "mainPanelWrapperStyle";

Detail detail = new Detail(panelConfig);

detail.AddControl(token, detailPanel, connectionString, page);

}

if (panelConfig.Buttons.Count() != 0)

{

LoadButtons(pageConfig, body, panelConfig, gridClientId, gridId);

}

if (panelConfig.PlugIns.Count() != 0)

{

LoadPluginPanels(token, proxy, body, panelConfig);

}

// add as last not to disturb page build up

AddWaitingControl(body);

}

The LoadPluginPanels method is as below:

private static void LoadPluginPanels(SecurityToken token, EventServiceClient proxy, Panel body, PanelConfig panelConfig)

{

foreach (var pluginConfig in panelConfig.PlugIns)

{

body.Controls.Add(new LiteralControl("<br />"));

Panel pluginPanel = new Panel { CssClass = "mainPanelWrapperStyle" };

RadAjaxPanel pluginUpdatePanel = new RadAjaxPanel

{

ID = "pluginUpdatePanel_" + pluginConfig.Name

};

pluginUpdatePanel.Controls.Add(new Timer { Interval = 5000 });

string controlString = proxy.LoadWebControl(token, pluginConfig.Name, pluginConfig.Configuration);

if (controlString == null)

{

continue;

}

pluginUpdatePanel.Controls.Add(new LiteralControl(controlString));

pluginPanel.Controls.Add(pluginUpdatePanel);

body.Controls.Add(pluginPanel);

}

The LoadWebControl method returns the string i.e. ASP.NET tags for the controls to be added to the panel as below: For example, one such tag returned is as below:

"<div style="height:600px;width:400px;overflow:auto;">
<img src="./temp/cachePreviewArray1bd5e9ee-1afd-4f17-8e42-e1a2b26884f7.jpg" width="270" height="480" />
</div>"

The UpdatePageControl method is called from Page_Load method of Default page class as below:

protected void Page_Load(object sender, EventArgs e)

{

if (!LogOnHelper.Attach(this))

{

log.WarnFormatCulture("Attaching web page failed.");

return;

}

SecurityToken token = new SessionData(Session).SecurityToken;

EventServiceClient proxy = new EventServiceClient();

using (proxy)

{

foreach (string pageName in proxy.GetMenuPageNames(token))

{

RadButton menuButton = new RadButton

{

ID = pageName,

Text = pageName,

Width = Unit.Pixel(94),

Height = Unit.Pixel(50),

Skin = "Office2007",

EnableBrowserButtonStyle = true

};

menuButton.Click += this.MenuButtonClick;

this.menuColumn.Controls.Add(menuButton);

}

string pageConfig = new UrlData(Page.Request).PageConfig;

if (string.IsNullOrEmpty(pageConfig))

{

log.WarnFormatCulture("Page config parameter not found. Using Home in stead.");

this.Title = "{0} : Home".FormatCulture(token.SessionInfo.Station);

return;

}

PageController.UpdatePageControl(pageConfig, this.MainPanel, this, IsPostBack, this.GridPlaceholder, this.RadAjaxManager1);

}

PLS help me in solving this problem.

Thanks in Advance...

Lakshmi

Ajax

answered on 10 May 2011

1 answer

220 views

show wait cursor or rotator during tab change?

I have an application that I would like to add some sort of wait indicator to during changes in tab selection. Each tab has 15+ RadSlider controls on it, and upon first navigation to each tab the browser freezes for about 5 seconds then I get a wait cursor (the browser reports as not responding) for another 5+ seconds. I would like to show some sort of visual indication from the beginning. I have tried showing a modal popup, showing a spinner, and changing the cursor. Anything that involves an update of the display never shows, however alerts do show. Is there any way to force processing to pause and update the display during the OnClientTabSelecting event?

TabStrip

answered on 10 May 2011

1 answer

96 views

Date picker - Hot key for current day

HI ,
Good Evenning!!

I have an requirement in my project. when we enter 'today' or 'c' in date picker , needs to show 'Current date' ( say May 10th).

please hlep me with code part.

Calendar

answered on 10 May 2011