Add Button to Grid Row

[Terrina]

I've been looking, but I can't seem to find a clear example of what I'm looking for. I wish to add an ajax.ActionLink to each row of my grid that has the ID of the row.  When this link is clicked, I wish for this ID to be sent back to the controller so that I can do some additional functions, and pass back a new set of data to be displayed in a different div.  This is my code for now.  This particular grid performs one function, which is to maintain the information on any new attorneys that we receive correspondence for, and they're able to add and update as needed.  Now, the function I need is for them to select an attorney, new or current, and send that ID back to a controller to perform a completely separate update to a different table, and display the details of that update in a grid in a separate partial view contained in the "attyImgDtls" div referenced.

If the Ajax link isn't possible, I need to know how to add a link to each row, and send the ID of that row back to a controller to perform the new update that I need.  I already tried adding a separate custom button, but got errors stating that a custom button couldn't be added for my particular situation.  I'm not quite sure why there isn't a simple "select" action available along with the Read, Update, and Create actions.

@(Html.Kendo().Grid(Model)

        .Name("SubroAttorneys")

        .Columns(columns =>

        {

            columns.Template(@<text></text>).ClientTemplate(

                @Ajax.ActionLink("Add", "SelectNewAtty", new { EquipmentId = "#= SubroAttyID#" }, 

                 new AjaxOptions { HttpMethod = "POST", Confirm = "Are you sure?", UpdateTargetId="attyImgDtls", InsertionMode = InsertionMode.Replace }).ToHtmlString()

            );

                        columns.Bound(a => a.SubroAttyFirmName).Title("Firm Name").Width(250);

            columns.Command(command => { command.Edit(); }).Width(250);


 

        })

        .ToolBar(toolbar => toolbar.Create())

        .Editable(editable => editable.Mode(GridEditMode.PopUp))

        .DataSource(dataSource => dataSource

            .Ajax()

            .Model(model => model.Id(a => a.SubroAttyID))

                .Create(update => update.Action("AttyEditingPopup_Create", "ClerkMain"))

                .Update(update => update.Action("AttyEditingPopup_Update", "ClerkMain"))

                .Read(update => update.Action("AttyEditingPopup_Read", "ClerkMain"))


 

        )

        .Selectable()        

        .ClientDetailTemplateId("template")
       )

[Dimo]

Hi Terrina,

The Grid is initially databound server-side...

Html.Kendo().Grid(Model)

... but then all subsequent data operations are executed via Ajax.

.DataSource(dataSource => dataSource
   .Ajax()
)

Such a setup implies that you use both types of templates - server and client. Currently the server template is empty, which defeats the purpose of having initial server binding (in case you are doing it for accessibility reasons). For example, if Javascript is disabled, the column with the empty server template will contain empty cells.

In addition, and more importantly, the client template contains HTML markup, which is generated on the server (an ActionLink helper that renders as an anchor), but depends on data, which is available on the client (EquipmentId). This can't possibly work. The correct approach is to use an ActionLink in a server template or a plain anchor element in a client template.

The Grid selection is purely visual and is not strictly related to making data requests, that's why a Select action does not exist out-of-the-box.

Regards,
Dimo
Telerik