Questions on UI for ASP.NET AJAX Forum

2 answers

224 views

Added Custom Header Row - How Do I Remove or Suppress the "rgHeader" Css Class from the Generated <TH> Element?

Telerik.Web.UI v2010.3.1109.35

We have a radgrid (Theme/Skin="Windows7") and we've added a custom header row like this:

// ***** Add Grid Header Summary Row *****

GridItem[] header = this.MyWorkRadGrid.MasterTableView.GetItems(GridItemType.Header);

//get the current THead element

GridTHead head = ((GridTHead)header[0].Parent.Controls[1].Parent);

//create a new GridHeaderItem which will be the new row

GridHeaderItem newHeaderItem = new GridHeaderItem(this.MyWorkRadGrid.MasterTableView, 0, 0);

newHeaderItem.Width = Unit.Percentage(100);

newHeaderItem.Height = Unit.Pixel(23);

// Create a cell to hold the toolbar

GridTableHeaderCell newHeaderCell = new

GridTableHeaderCell() { Width = Unit.Percentage(100), HorizontalAlign = HorizontalAlign.Left, VerticalAlign = VerticalAlign.Top };

newHeaderItem.Cells.Add(new GridTableHeaderCell() { Text = "" });

newHeaderCell.ColumnSpan = 5;

newHeaderItem.Width = Unit.Percentage(100);

newHeaderItem.Height = Unit.Pixel(23);

// Create the toolbar

RadToolBar toolBar = new RadToolBar();

toolBar.Height = Unit.Pixel(23);

toolBar.Skin = "Windows7";

toolBar.Width = Unit.Percentage(100);

// Create the toolbar item

RadToolBarButton button = new RadToolBarButton("Contact List");

toolBar.Items.Add(button);

// Add Controls

newHeaderCell.Controls.Add(toolBar);

newHeaderItem.Cells.Add(newHeaderCell);

for (int i = 0; i < head.Controls.Count; i++)

{

// loop through the header controls collection and find the 'row' that has the same type of GridHeaderItem

// Then insert the new row just above it - remember the 0 based index will push the original header row down

if (head.Controls[i].GetType() == newHeaderItem.GetType())

{

head.Controls.AddAt(i, newHeaderItem);

}

In this case, we added a toolbar to the header to be consistent with toolbars we have as headers on a left and right pane that sit next to this grid in the center pane.
The output of this is shown in image "Ex1.jpg" where the text is "Contact List".

The problem is that the new grid header has default padding that ends up surrounding any content you put into it.
See image "Ex2.jpg" where the purple color is the padding surrounding our content (which is a RadToolBar shown in blue shade).

When you look at the output in FireBug, the offending css class is "rgHeader" on the generated <TH> element.
See image "Ex3.jpg" - highlighted in blue.

When I use FireBug to remove that class, the padding is gone and the toolbar takes up the entire space (no more padding) and matches the other toolbars across all RadPanes.
See image "Ex4.jpg" - you can see "Contact List" toolbar text matches the toolbar on the left pane "My Workspace".

We want to keep the Windows7 Themes on the controls but can you show me how to remove or suppress that "rgHeader" class from the generated <TH> element so that we do not have to deal with the left,top,right,bottom padding it generates?

If solution can be done in code-behind, great, give me that.
If solution is style/css based in aspx page, then show me what I need to do/add.

Thanks,
Ray

Grid

answered on 04 Jan 2011

3 answers

638 views

RadGrid ItemStyle Padding-Right

Hi
A bit of a newbie question so should be quick to answer. I have created a radgrid with some columns with numeric data that also have filters. I have aligned these columns right but that leaves my text aligned with the filter symbol. I would like to add right padding to the cells so that the text is indented. I have applied a CssClass which works for font, background etc but I din't have any success when using the padding-right statement. Here is my code:

ASPX

CSS

.ItemCellPad

{

padding-right:10px;

}

What am I doing wrong??

cheers

Michael

Grid

answered on 04 Jan 2011

1 answer

313 views

Get file size client side

Hi,
I have been trolling through the forums and documentation for the AsyncUpload control and I was trying to find out if there is a method or property available client-side that would let me get the size of the file uploaded. It could be either before or after the file is uploaded, although I would prefer before. I was trying to use the following -

sender._uploadedFiles[0].fileInfo.ContentLength

But that only works on smaller files. If I upload a 5mb file the content length is only around 500,000 or so, and on a 3mb file it is 1,800,000. I would have thought something like InputStream.Length would be available client side???

Thanks

Matt.

AsyncUpload

answered on 04 Jan 2011

3 answers

117 views

Self Referencing Grid - Unable to edit child row

Hi, sorry if this is a basic question but I need some direction on how to call editItem() client-side on a child row in a hierarchical grid (which could have 3 or more levels).

I understand that the get_itemIndexHierarchical() returns a string representing the path and also how some recommend using the last part after the last underscore. But I have had no luck figuring out how to use it and all my iterations of code end up either blowing up with id or object is null or it selects the parent.

Current iteration of my code:

function ElementRowDblClick(sender, eventArgs) {

var grid = sender;

var MasterTable = grid.get_masterTableView();

var row = MasterTable.get_dataItems()[eventArgs.get_itemIndexHierarchical()];

debugger;

$find("<%= rgData.MasterTableView.ClientID %>").editItem(row);

}

Can anyone help point me in the right direction?

I have pondered using the string ("0:0_0:0_0") and parsing it to calculate a row index however it seems I would have to traverse child items or recursively search for an item to pass it to editItem()? I have set HierarchyLoadMode="Client" and GroupLoadMode="Client" although I'm not using groups anyway. And client settings are:

<ClientSettings AllowExpandCollapse="true" >

<ClientEvents OnRowDblClick="ElementRowDblClick" />

<Selecting AllowRowSelect="True" />

</ClientSettings>

I have trawled many forum postings but can't seem to find anything similar to what I want to achieve, i.e. putting the row I double click into edit, via editItem(), and not just the parent row.

Any help very much appreciated.

Grid

answered on 04 Jan 2011

2 answers

168 views

Postback on Check only

Is there a way to make it so the listbox only postbacks on check and not also on selection?

I have AutoPostBack="true" and OnItemCheck set to my server side function. It works great, but when you click on an item and not the check box, it posts back as well. Is there a way to stop that postback but still allow the checkbox check postback?

ListBox

answered on 04 Jan 2011

3 answers

422 views

Destroy Rad window

I am opening a page in rad window. ( Radwindow manager is on the maser page described as follow). I have cacel button on the page.
Which has code according to your example.
When I cancel out it closes the window but when I open window second time and click on cancel it closes current window and now it's showing the old window again. For this example I am using radWINModalPostLogin windwow.

<

telerik:RadWindowManager ID="radWindowManager" Style="z-index: 8001;"

runat="server" Skin="Vista" OnClientClose="OnClientClose" EnableViewState="false" ShowContentDuringLoad="false" >

<telerik:RadWindow ID="radWINModalPostLogin" runat="server" ReloadOnShow="True" DestroyOnClose="true" Behaviors="None"

Left="" VisibleTitlebar="False" VisibleOnPageLoad="false" Style="display: none;" Top="" Modal="True" KeepInScreenBounds="True" >

</telerik:RadWindow>

<telerik:RadWindow ID="radWINDialogPostLogin" VisibleStatusbar="false" runat="server" VisibleOnPageLoad="false"

Left="" VisibleTitlebar="True" Style="display: none;" Top="" Modal="False" Behaviors="Close" >

</telerik:RadWindow>

</Windows>

</telerik:RadWindowManager>

Window

answered on 04 Jan 2011

0 answers

85 views

DynamicRadGrid paging

I am using Dynamic data with DynamicRadGrid, and i am running into problem with paging.

<XXX:DynamicRadGrid ID="RadGrid1" AllowPaging="True" AutoGenerateColumns="false" runat="server" DataSourceID="GridDataSource" OnItemDataBound="RadGrid1_ItemDataBound" OnItemCommand="RadGrid1_ItemCommand">

<PagerStyle CssClass="clPanelPaging" BackColor="White" ShowPagerText="true" Mode="NumericPages" />

<ExportSettings ExportOnlyData="true" IgnorePaging="true" OpenInNewWindow="true" />

<MasterTableView EditMode="InPlace">

<CommandItemSettings ExportToPdfText="Export to Pdf"></CommandItemSettings>

</MasterTableView>

</XXX:DynamicRadGrid>

<asp:DataServiceLinqDataSource ID="GridDataSource" runat="server" EnableDelete="true" EnableUpdate="true" AutoPage="false">

</asp:DataServiceLinqDataSource>

If i set autopage to false, i see page by page. But as its server side paging i dont get correct item count. If i set the autopage to false, then i get the complete data set, but paging doesnt work.

When i click on page-2, it binds the data again and moves back to page-1.
Any suggestions?

thanks in advance!!
-guru

General Discussions

asked on 04 Jan 2011

4 answers

104 views

Ho do I save changes to a datasource ...

... i binded to in codebehind?

I Have started to get up and running with my small test-projekt for evaluating Telerik ...

I have managed to bind a datattable through NeedDatasource. Like this:

'Set datasource

ProductGrid.DataSource = New Products.Table(Client.ConnectionString)

The tableobject is a custom object wich inherit a Data.DatatTable wich has connection and adapter objects etc. Insert, Update and delete commands are generated and I can save all changes by simply calling

ProductTable.Save()

Nothing fancy about it ... When building WinForm I just bind to my table make some chnages in grid and then call save and voila ... Done!

But can I do this way too when working with RadGrid? Or do I have to retrieve all values and do a manual update?

//h

Grid

answered on 04 Jan 2011

1 answer

77 views

Cannot overlay radmenu using jquery modal dialog

Hi

I not able to overlay RadMenu when using jquery dialog with modal option.

Any ideas on how to fix this issue so that I can disable the RadMenu along with rest of page when calling the dialog. This is code

$(

"#dialog1").dialog({modal:true, });

Thanks

Menu

answered on 04 Jan 2011

3 answers

116 views

how to add item into RadTagCloud from Client Side

Hello ,

i have a radtagcloud item , i want use it like shopping - basket.

user select a row from RadGrid in Client , and i want to add "ID" value on grid into RadTagCloud via Java Script. How can i do that ?

here is the code below :

function

OnRowSelected(sender, eventArgs) {

// add into radtagcloud

var colIndex = 0;

var rowIndex = eventArgs._itemIndexHierarchical;

if (rowIndex > -1) {

var value = sender._selection._masterTable.children[rowIndex].cells[colIndex].innerText;

if (value != null) {

// add this item into cloud.

??

}

}

thanks