No postback when click on a checkbox-cell in RadGrid

[Anders]

I’m using <ClientSettings EnablePostBackOnRowClick="True"> to do Codebehind stuff when the user click on a row in a RadGrid.

The first column in the RadGrid is a <GridTemplateColumn> that I have a checkbox in:

 

<radG:GridTemplateColumn Groupable="False" Reorderable="False" UniqueName="SelectColumn" AutoPostBackOnFilter="false" >

                        <HeaderTemplate>

                            <asp:CheckBox ID="chkCheckAll" runat="server" ToolTip="!Select/deselect all" />

                        </HeaderTemplate>

                        <ItemTemplate>

                            <asp:CheckBox ID="chkSelected" AutoPostBack="true" runat="server" OnCheckedChanged="chkSelected_CheckedChanged" />

                        </ItemTemplate>

                        <HeaderStyle Width="25px" />

                        <ItemStyle HorizontalAlign="Center"  />

                    </radG:GridTemplateColumn>

 

My problem is that I don’t want a postback when the checkbox column is checked. I also want the row to me selected when checking the checkbox.

[Shinu]

HI Anders,

You may consider using a GridClientSelectColumn for achieving the desired scenario. GridClientSelectColumn allows the user to select a row on the client side on clicking the CheckBox. For this you also have to set AllowRowSelect property to true in the ClientSettings.


ASPX:

<ClientSettings>
           <Selecting  AllowRowSelect="True" />
    </ClientSettings>

 <telerik:GridClientSelectColumn UniqueName="SelectColumn" ></telerik:GridClientSelectColumn>

Thanks
Shinu

[Pavlina]

Hi Anders,

I suggest you to use GridClientSelectColumn instead of GridTemplateColumn with CheckBox. In this case you will be able to select row when checking the checkbox without postback.

For more information see the following links:
Client-side row selection
Server-side row selection

Greetings,
Pavlina
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Anders]

The thing is that I want to have a postback when the client clicks on the row, but not a postback when the checkbox column is checked. I also got new directions about row selection:

1. Now the grid should only allow single row selection
2. When checking the checkboxes no row selcetions should be made.

[Princy]

Hello Anders,

Try out the following code to disable row selection on clicking a checkbox. Also set the AllowMultiRowSelection to false to allow only single row selection.
aspx:

<telerik:RadGrid ID="RadGrid1" AllowMultiRowSelection="false" DataSourceID="SqlDataSource1" runat="server" >

<MasterTableView DataSourceID="SqlDataSource1" >

<Columns>

.....

</Columns>

</MasterTableView>

<ClientSettings EnablePostBackOnRowClick="true">

<ClientEvents OnRowSelecting="OnRowSelecting"   />

<Selecting AllowRowSelect="True" />

</ClientSettings>

</telerik:RadGrid>

js:

 function OnRowSelecting(sender, args)
  {
    var e = args.get_domEvent();
    var targetElement = e.srcElement || e.target;
    //is the clicked element an input checkbox? <input type="checkbox"...>
    if(targetElement.tagName.toLowerCase() != "input" && (!targetElement.type || targetElement.type.toLowerCase() != "checkbox"))
    {
        alert("Clicked on Row");
    }
    else
    {
        alert("Clicked on CheckBox");
        args.set_cancel(true);
    }
}

Thanks
Princy.

[Anders]

Noting happens on the call

var

e = args.get_domEvent();

where can I find what to do with the "args object".

 

[Anders]

Now I've struggled with this all day.
What if I use <ClientSettings EnablePostBackOnRowClick="false"> 
and manually call a server function from javascript. Could that be possible?

[Pavlina]

Hi Anders,

To get or set property values for client API properties, you must call property accessor methods that are named with the get_ and set_ prefixes. For example, to get or set a value for a property such as cancel, you call the get_cancel or set_cancel.

At client-side you can execute your own JavaScript functions at certain stages of the AJAX request. Additionally you can use a generic JavaScript function to make explicit AJAX requests to the server from the client.  

You can construct the javascript function to manually invoke Ajax request through the ajaxRequest() method of RadAjax.

More information is available in the following help articles:
OnRowSelected
Client-Side API

Regards,
Pavlina
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.