Grid sort icon is a submit button

[Adam Lindsay]

I have a page that I need to process the "Enter" key to perform a specific function based on the srcElement.  I have set all of the buttons on the page to not user default submit behavior to prevent them from clicking with the enter key.  However the grid sort icon renders as an input type=submit.  This is click when I press the enter key.

Is there a way to have the sort icon to not render as a submit type?

[Dimo]

Hi Adam Lindsay,

If you set the ImagesPath property of RadGrid, all icons (for sorting, filtering, paging, etc) will be rendered as ImageButtons, instead of PushButtons.

In addition, you will have to supply images with specific names at the ImagesPath location. These image names are listed at:

http://www.telerik.com/help/aspnet-ajax/grdskins.html

(You can take non-embedded images with the required names from the /Skins/ subfolder of your RadControls installation location or ZIP file)

Greetings,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Adam Lindsay]

I am unable to get this to work (The images still generate markup where they are submit buttons).  Can you provide a brief example?  I am using a custom skin on my grid.  Here is the markup for the grid:

<

 

Common:RadGrid ID="ServiceHistoryGrid" GridLines="Both" AllowMultiRowSelection="False"

 

 

 

EnableAJAX="False" ShowStatusBar="True" PageSize="50" AllowPaging="True" AllowSorting="True"

 

 

 

runat="server" Skin="Green" EnableEmbeddedSkins="false" OnNeedDataSource="ServiceHistoryGrid_NeedDataSource"

 

 

 

OnItemDataBound="ServiceHistoryGrid_ItemDataBound" Width="99%" Height="100%" ImagePath="Images/Grid/Green" >

 

 

 

<ClientSettings AllowColumnsReorder="True" ReorderColumnsOnClient="True">

 

 

 

<Resizing AllowColumnResize="True" AllowRowResize="False" />

 

 

 

<Selecting AllowRowSelect="False" />

 

 

 

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

 

 

 

</ClientSettings>

 

 

 

<MasterTableView AutoGenerateColumns="false" ClientDataKeyNames="DocumentNumber,OtherServicesQty">

 

 

 

<Columns>

 

 

 

<telerik:GridHyperLinkColumn HeaderText="Document" HeaderStyle-Width="100" DataTextField="DocumentNumber"

 

 

 

DataNavigateUrlFields="DocumentNumber" UniqueName="DocumentNumber" SortExpression="DocumentNumber"

 

 

 

DataNavigateUrlFormatString="javascript:OpenDocumentInNewWindow('DocumentNumber={0}');">

 

 

 

</telerik:GridHyperLinkColumn>

 

 

 

<telerik:GridBoundColumn HeaderText="Document" HeaderStyle-Width="100" DataField="DocumentNumber"

 

 

 

UniqueName="ExportDocumentNumber" Visible="false" />

 

 

 

<telerik:GridTemplateColumn HeaderText="Date" HeaderStyle-Width="125" DataField="DocumentDate"

 

 

 

UniqueName="DocumentDate" SortExpression="DocumentDate">

 

 

 

<ItemTemplate>

 

 

<%

# Common.FormatDate.DateTimeFormatToString((DateTime)DataBinder.Eval(Container.DataItem, "DocumentDate"), Steriworks.Shell.SessionHelper.Instance.Culture)%>

 

 

 

</ItemTemplate>

 

 

 

</telerik:GridTemplateColumn>

 

 

 

<telerik:GridTemplateColumn HeaderText="Status" HeaderStyle-Width="100" UniqueName="RecordStatus"

 

 

 

SortExpression="RecordStatus">

 

 

 

<ItemTemplate>

 

 

<%

# FormatStatus(((GridDataItem) Container)) %>

 

 

 

</ItemTemplate>

 

 

 

</telerik:GridTemplateColumn>

 

 

 

<telerik:GridTemplateColumn HeaderText="Route" SortExpression="RouteCode" UniqueName="RouteCode"

 

 

 

HeaderStyle-Width="50">

 

 

 

<ItemTemplate>

 

 

<%

# FormatRoute(((GridDataItem) Container)) %>

 

 

 

</ItemTemplate>

 

 

 

</telerik:GridTemplateColumn>

 

 

 

<telerik:GridBoundColumn HeaderText="Route" HeaderStyle-Width="50" DataField="RouteCode"

 

 

 

UniqueName="ExportRouteCode" Visible="false" />

 

 

 

<telerik:GridBoundColumn HeaderText="Employee" HeaderStyle-Width="100" DataField="EmployeeName"

 

 

 

UniqueName="EmployeeName" SortExpression="EmployeeName" />

 

 

 

<telerik:GridBoundColumn HeaderText="Containers" HeaderStyle-Width="80" DataField="ContainerQty"

 

 

 

UniqueName="ContainerQty" SortExpression="ContainerQty" />

 

 

 

<telerik:GridBoundColumn HeaderText="Products" HeaderStyle-Width="50" DataField="DeliveryQty"

 

 

 

UniqueName="DeliveryQty" SortExpression="DeliveryQty" />

 

 

 

<telerik:GridTemplateColumn HeaderText="Other Services" SortExpression="OtherServicesQty"

 

 

 

UniqueName="OtherServices" HeaderStyle-Width="50">

 

 

 

<ItemTemplate>

 

 

<%

# FormatValue(((GridDataItem) Container)) %>

 

 

 

</ItemTemplate>

 

 

 

</telerik:GridTemplateColumn>

 

 

 

<telerik:GridBoundColumn HeaderText="Bill Weight" HeaderStyle-Width="50" DataField="BillContainerWeightQty"

 

 

 

UniqueName="BillContainerWeightQty" SortExpression="BillContainerWeightQty" />

 

 

 

<telerik:GridBoundColumn HeaderText="Container Weight" HeaderStyle-Width="50" DataField="ContainerWeightQty"

 

 

 

UniqueName="ContainerWeightQty" SortExpression="ContainerWeightQty" />

 

 

 

<telerik:GridBoundColumn HeaderText="All Weight" HeaderStyle-Width="50" DataField="AllContainerHaveWeightsFlag"

 

 

 

UniqueName="AllContainerHaveWeightsFlag" SortExpression="AllContainerHaveWeightsFlag" />

 

 

 

<telerik:GridBoundColumn HeaderText="Facility" HeaderStyle-Width="175" DataField="Facility"

 

 

 

UniqueName="Facility" SortExpression="Facility" />

 

 

 

</Columns>

 

 

 

<NoRecordsTemplate>

 

 

 

<div class="NoRecordText">

 

 

No records to display.

</div>

 

 

 

</NoRecordsTemplate>

 

 

 

</MasterTableView>

 

 

 

<PagerStyle Mode="NumericPages" AlwaysVisible="true" />

 

 

 

</Common:RadGrid>

 

 

- Thanks.

[Dimo]

Hi Adam,

Please set ImagesPath, not ImagePath.

Here is a simple example with no submit buttons.

<%@ Page Language="C#" %>
<%@ Import Namespace="System.Data" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<script runat="server">

    protected void RadGrid_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
    {
        DataTable dt = new DataTable();
        DataRow dr;
        int colsNum = 2;
        int rowsNum = 15;
        string colName = "Column";

        for (int j = 1; j <= colsNum; j++)
        {
            dt.Columns.Add(String.Format("{0}{1}", colName, j));
        }

        for (int i = 1; i <= rowsNum; i++)
        {
            dr = dt.NewRow();

            for (int k = 1; k <= colsNum; k++)
            {
                dr[String.Format("{0}{1}", colName, k)] = String.Format("{0}{1} Row{2}", colName, k, i);
            }
            dt.Rows.Add(dr);
        }

        (sender as RadGrid).DataSource = dt;
    }

</script>

<!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 id="Head1" runat="server">
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>RadControls</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />

<telerik:RadGrid
    ID="RadGrid1"
    runat="server"
    Width="600px"
    AllowSorting="true"
    AllowFilteringByColumn="true"
    AllowPaging="true"
    ImagesPath="~/grid_images/"
    OnNeedDataSource="RadGrid_NeedDataSource">

</telerik:RadGrid>

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

All the best,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.