Action Links in Grid

5 posts, 1 answers
  1. John
    John avatar
    8 posts
    Member since:
    Jan 2018

    Posted 08 Jan 2018 Link to this post

    Scenario - Asp.net Core, Razor Pages     

    If i have no Controller (using razor pages), is there a way to bind a column to a clientTemplate that contain some sort of Action Link or Navigation link?

    I need this so a user can simple click on a link on a row in the grid whicj then does the usual "Edit, Details, Delete"

     

    If i was to not have telerik grid and just us a table it would look like this:

     <td>
                    <a asp-page="./Edit" asp-route-id="@item.Id">Edit</a> |
                    <a asp-page="./Details" asp-route-id="@item.Id">Details</a> |
                    <a asp-page="./Delete" asp-route-id="@item.Id">Delete</a>
                </td>
            </tr>
    }
        </tbody>
    </table>

     

  2. John
    John avatar
    8 posts
    Member since:
    Jan 2018

    Posted 08 Jan 2018 in reply to John Link to this post

    i am almost thee with this but not quite...

     

    columns.Bound(p => p.Id).ClientTemplate("<a asp-page='./ Edit' asp-route-id='@item.Id'>Edit</a>");

  3. Answer
    Stefan
    Admin
    Stefan avatar
    3034 posts

    Posted 10 Jan 2018 Link to this post

    Hello, John,

    The issue occurs because the client template is evaluated on the client where the page does not have access to the RazoPages asp-page attributes.

    Currently, the action links can be set in the following format:

    https://docs.telerik.com/aspnet-mvc/helpers/grid/faq#how-to-use-action-links

    The other option will be to directly set the href over the anchor element:

    .ClientTemplate("<a href=./Edit>Edit</a>");


    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  4. TESSA
    TESSA avatar
    1 posts
    Member since:
    May 2015

    Posted 14 Jun 2020 in reply to Stefan Link to this post

    I have seen many queries on Grid custom action links,most of them cover Ajax calls, not many explaining with multiple parameters when using Model binding. 

    Here is full page  sample  with BindTo(Model)  

    This was done in ,NET Core 3.1  VS2019 MVC project

     

     

    @using GridTestActionLink.ViewModels
    @using Kendo.Mvc.UI
    @model IEnumerable<GridTestActionLink.ViewModels.Users>

    @{ ViewData["Title"] = "Index"; }

    <h1>Index</h1>

    @(Html.Kendo().Grid<Users>()
        .Name("gridUsers")
        .Columns(columns =>
        {
            columns.Bound(c => c.UserId).ClientTemplate("<a href='" + Url.Action("LinkPage", "Home", new {UserId = "#=UserId#", UserName="#=UserName#"}) + "'>#=UserName#</a>");
        columns.Bound(c => c.UserName);
          

        })
        .HtmlAttributes(new { style = "height: 650px;" })
        .Scrollable()
        .Pageable(page =>
        {
            page.Refresh(true)
                .PageSizes(true)
                .ButtonCount(5);
        })
        .ToolBar(t => t.Search())
        .Sortable()
        .BindTo(Model)
        )

  5. Petar
    Admin
    Petar avatar
    458 posts

    Posted 17 Jun 2020 Link to this post

    Hi Tessa,

    Thank you for sharing the example with the community!

    Your post will surely help someone who wants to use Action links inside the Grid which data is populated using "BindTo(Model)".

    Regards,
    Petar
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
Back to Top