RadGrid migration from Server to Client Data Binding (LinkButton/CommandArguments)

[Richard]

Howdy all.  I've been banging my head on the wall trying to make this work and just need a bit of assistance.  So at a high level, I'm migrating several RadGrid from a server side databinding to a RadClientDataSource/ClientDataSourceID.  Everything is going great and I've replaced most of the functionality but have one area where I just can't seem to make it work right.

 

In the past, I would have a RadGrid and it would have an OnItemDataBound event that included something like:

 

((LinkButton)e.Item.FindControl("linkButton")).CommandArgument = DataBinder.Eval(e.Item.DataItem, "SomethingInData").ToString();

And then clicking on that LinkButton in the RadGrid would run the associated event on the LinkButton.  What I can't seem to figure out is how to set the CommandArgument when we are doing a clientSide Databind.

 

I'm assuming I will need to use ClientSettings-ClientEvents-OnDataBound event and some JavaScript to set the CommandArgument value but I can't seem to figure out how to do it.

 

Thanks,

Richard

 

Here is the full code.  I'm setting the Select URL from CodeBehind based on a few variables.

<telerik:RadClientDataSource ID="RadClientDataSource1" runat="server" AllowBatchOperations="true">
        <DataSource>
            <WebServiceDataSourceSettings>
                <Select DataType="JSON" />
            </WebServiceDataSourceSettings>
        </DataSource>
        <Schema>
            <Model ID="SipID">
                <telerik:ClientDataSourceModelField FieldName="UserPrincipalName" DataType="String" />
                <telerik:ClientDataSourceModelField FieldName="SamAccountName" DataType="String" />
                <telerik:ClientDataSourceModelField FieldName="LockoutTime" DataType="String" />
                <telerik:ClientDataSourceModelField FieldName="UnlockURL" DataType="String" />
            </Model>
        </Schema>
    </telerik:RadClientDataSource>



    <telerik:RadGrid ID="gridItems" OnItemDataBound="gridItems_ItemCreated" RenderMode="Lightweight" ClientDataSourceID="RadClientDataSource1"
        Width="100%" AutoGenerateColumns="false" AllowFilteringByColumn="False" Skin="Silk" PagerStyle-Position="TopAndBottom"
        AllowSorting="True" AllowMultiRowSelection="False" runat="server" Gridlines="None">
        <MasterTableView HeaderStyle-ForeColor="Black" Width="100%" DataKeyNames="SamAccountName" ClientDataKeyNames="SamAccountName" AllowFilteringByColumn="False">
            <Columns>
                <telerik:GridBoundColumn DataField="UserPrincipalName" HeaderText="User" HeaderStyle-BackColor="LightSteelBlue" />
                <telerik:GridBoundColumn DataField="UserPrincipalName" HeaderText="User" HeaderStyle-BackColor="LightSteelBlue" ItemStyle-Width="200" />

                <telerik:GridTemplateColumn InitializeTemplatesFirst="true" AllowFiltering="false" HeaderStyle-BackColor="LightSteelBlue" ItemStyle-Width="100">
                    <HeaderTemplate>Unlock</HeaderTemplate>
                    <ItemTemplate>
                        <asp:LinkButton runat="server" ID="lnkUnlock" Text="Unlock" OnCommand="lnkUnlock_Command" />
                    </ItemTemplate>
                </telerik:GridTemplateColumn>
            </Columns>
        </MasterTableView>
        <PagerStyle Mode="NumericPages" />
        <GroupingSettings CaseSensitive="false" />
        <ClientSettings EnableRowHoverStyle="true">
            <ClientEvents />
        </ClientSettings>
    </telerik:RadGrid>

 

 

[Attila Antal]

Hi Richard,

I think for this scenario the best would be to use GridTemplateColumn with ClientItemTemplate and use the client-side bind expressions like #= FieldName # and instead of doing a postback with the button, you can make RadGrid to fire a command. Using this method, you can subscribe to ItemCommand server-side event of RadGrid to handle it further.

For example, the GridTemplateColumn could look like as follows:

<telerik:GridTemplateColumn UniqueName="TitleClientTemplateColumn" HeaderText="Title" DataField="ShipName">
    <ClientItemTemplate>
         <a onclick="if(!$find($(this).parents('.rgMasterTable')[0].id).fireCommand('MyCustomCommand','#=OrderID #')); return false;" href="javascript:void(0)">#=ShipCountry #</a>
    </ClientItemTemplate>
</telerik:GridTemplateColumn>

C# - The ItemCommand event handler

protected void RadGrid1_ItemCommand(object sender, GridCommandEventArgs e)
{
    if(e.CommandName == "MyCustomCommand")
        RadAjaxManager1.Alert(e.CommandArgument.ToString());
}

Alternatively, you can use the OnRowDataBound event to get access to the rows and controls inside it.

I trust this will be suitable for your scenario. Please give it a try to see if that works for you.

Kind regards,
Attila Antal
Progress Telerik

[Richard]

Thanks!  That was exactly what I was looking for.  I didn't even think of using the .fireCommand as an option.  Thank you again.

Richard