This is a migrated thread and some comments may be shown as answers.

RadGrid questions

3 Answers 85 Views

General Discussions

This is a migrated thread and some comments may be shown as answers.

John asked on 03 Feb 2011, 04:41 AM

image1.jpg

image2.jpg

I have a RADGrid with one button column and rest bound columns as follows;

<telerik:RadGrid ID="DocsList" runat="server" AllowPaging="True" GridLines="None"

OnNeedDataSource="DocsList_NeedDataSource">

<MasterTableView AutoGenerateColumns="False">

<Columns>

<telerik:GridBoundColumn FooterText="Document" UniqueName="Document" SortExpression="ContactTitle"

HeaderText="Document" DataField="Document" Resizable="true">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn FooterText="Index" UniqueName="Index" HeaderText="Index"

DataField="Index" Display="false">

<ItemStyle Width="0px" />

</telerik:GridBoundColumn>

<telerik:GridBoundColumn FooterText="MediaURL" UniqueName="MediaURL" HeaderText="MediaURL"

DataField="MediaURL" Display="false">

<ItemStyle Width="0px" />

</telerik:GridBoundColumn>

<telerik:GridButtonColumn FooterText="View" ButtonType="ImageButton" UniqueName="View"

HeaderText="View" ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center"

CommandName="Select" DataTextField="CustomerID" ImageUrl="~/Resources/Images/submit.png">

<ItemStyle Width="20px" />

</telerik:GridButtonColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

I have a few questions;

1. How can I attach an onclick event to the buttons in the button column so when a button in a row is clicked then value of one of the bound columns in the same row is returned?

2. The button images' seems to have an annoying shadow (image1.jpg attached). How can this be removed?

3. When this web page is being viewed in browser and browser window is scaled down the buttons start to crop instead of grid rescaling to allow the button to remain fully visible (image2.jpg attached). How can this be fixed?

Many Thanks

Regards

3 Answers, 1 is accepted

answered on 08 Feb 2011, 01:54 PM

Hello John,

Straight to your questions:

In order to implement the desired functionality, you can handle the ItemCommand event of the grid and retrieve the corresponding value as it is explained in this help topic. Another approach is to manually add an OnClick event handlers of the buttons on ItemCreated.
The shadow cannot be caused by the RadGrid. Do you have a FormDecorator on the page? If the issue persists, please send us the image.
I recommend that you set the width of the grid to 100% and set the columns in pixels. In this way the columns will occupy the available space.

I hope this helps.

Best wishes,
Mira
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

answered on 08 Feb 2011, 10:48 PM

submit.png

Hi Mira

Many thanks.

For some reason I can’t get rid of the shadows under the buttons in the grid buttons column. Web page code below. Any help would be appreciated.

Thanks

Regards

ViewDocument.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ViewDocument.aspx.cs" Inherits="SitefinityWebApp.Widgets.TestWidgets.WebForm2" %>

<!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">

<title></title>

</head>

<body>

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

<asp:ScriptManager ID="ScriptManager1" runat="server">

</asp:ScriptManager>

<div>

</div>

<telerik:RadGrid ID="DocsList" runat="server" AllowPaging="True" GridLines="None"

OnNeedDataSource="DocsList_NeedDataSource" Width="100%">

<MasterTableView AutoGenerateColumns="False">

<Columns>

<telerik:GridBoundColumn FooterText="Document" UniqueName="Document" SortExpression="ContactTitle"

HeaderText="Document" DataField="Document" Resizable="true">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn FooterText="Index" UniqueName="Index" HeaderText="Index"

DataField="Index" Display="false">

<ItemStyle Width="0px" />

</telerik:GridBoundColumn>

<telerik:GridBoundColumn FooterText="MediaURL" UniqueName="MediaURL" HeaderText="MediaURL"

DataField="MediaURL" Display="false">

<ItemStyle Width="0px" />

</telerik:GridBoundColumn>

<telerik:GridButtonColumn FooterText="View" ButtonType="ImageButton" UniqueName="View"

HeaderText="View" ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center"

CommandName="View" DataTextField="CustomerID" ImageUrl="~/Resources/Images/submit.png">

<ItemStyle Width="20px" />

</telerik:GridButtonColumn>

</Columns>

</MasterTableView>

<HeaderContextMenu EnableImageSprites="True" CssClass="GridContextMenu GridContextMenu_Default">

</HeaderContextMenu>

</telerik:RadGrid>

</form>

</body>

</html>

ViewDocument.aspx.cs

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data;

using Telerik.Web.UI;

namespace SitefinityWebApp.Widgets.TestWidgets

{

public partial class WebForm2 : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

}

protected void DocsList_ItemCommand(object source, Telerik.Web.UI.GridCommandEventArgs e)

{

// This method does not get called when button is pressed

if (e.CommandName == "View")

{

GridDataItem dataItem = e.Item as GridDataItem;

GridEditFormItem editItem = e.Item as GridEditFormItem;

string itemValue = dataItem["View"].Text;

}

protected void DocsList_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)

{

DocsList.DataSource = GetDataSetConventional();

}

private DataSet GetDataSetConventional()

{

DataSet _result = new DataSet();

_result.Tables.Add("results");

_result.Tables["results"].Columns.Add("Index");

_result.Tables["results"].Columns.Add("Document");

_result.Tables["results"].Columns.Add("MediaURL");

for (int i = 1; i <= 5; i++)

{

Console.WriteLine(i);

DataRow newRow = _result.Tables["results"].NewRow();

newRow["Index"] = i;

newRow["Document"] = "Document " + i.ToString();

newRow["MediaURL"] = "MediaURL " + i.ToString();

_result.Tables["results"].Rows.Add(newRow);

}

return _result;

}