如何从Syncfusion MVC Grid中的选定行获取列值

Question

Im My application ASP.NET MVC 5 im using Syncfusion controls.

Here is my view:

@using Reporter.Models
@model List<UsersListViewModel>


@(Html.EJ().Grid<object>("FlatGrid")
    .Datasource(Model)
    .AllowFiltering()
    .FilterSettings(d => d.FilterType(FilterType.Menu))
    .AllowSorting()
    .ToolbarSettings(toolBar => toolBar.ShowToolbar().ToolbarItems(items =>
    {
        items.AddTool(ToolBarItems.ExcelExport);
    }))
    .Columns(col =>
    {

        col.Field("OrderNumber").HeaderText("Lp.").TextAlign(TextAlign.Left).Width(15).AllowFiltering(false).Add();
        col.Field("UserName").HeaderText("Nazwa użytkownika").Width(50).Add();
        col.Field("CanReadReports").HeaderText("Dostęp do raportów").Width(40).AllowSorting(false).HeaderTextAlign(TextAlign.Center).Add();
        col.Field("IsAdministrator").HeaderText("Administrator").Width(40).AllowSorting(false).Add();
    })
    .Mappers(map => map.ExportToExcelAction("Account/UserListExportToExcel"))
    .AllowSelection()
    .SelectionType(SelectionType.Single)
)
<hr/>
<p style="text-align: justify">
    @Html.ActionLink("Nowy użytkownik", "Register", "Account",
    null,
    new { @class = "btn btn-default" }
    )
    @Html.ActionLink("Usuń użytkownika", "Register", "Account",
    new {user = "UserNameToRaplace"}, //here i want UserName from selected row
    new { @class = "btn btn-default" }
    )
    @Html.ActionLink("Zmień hasło", "Manage", "Account",
    new { user = "UserNameToRaplace"},
    new { @class = "btn btn-default" }
    )
</p>

And my problem is how to get UserName from selected row and paste it in ActionLink.

Answer 1

You can get the selected information in the getSelectedRecords method. But it will return all the selected records when multi-selection is enabled in grid.

So to get the current selected row data, you can simply access it from the arguments of the rowSelected event.

function onRowSelected(args) {
    var userName = args.data.UserName;

    //Do something.
};

Reference links: http://help.syncfusion.com/js/api/ejgrid#events:rowselected

Answer 2

In grid definition add

.ClientSideEvents(evt => evt.RowSelected("onRowSelected"))

and add javascript function

<script>    
    function onRowSelected(args) {
        var result = this.getSelectedRecords();

        var userName = result[0].UserName;        

        var deleteUserLink = $("#DeleteUser").attr('href');
        var changePassUserLink = $('#ChangePass').attr('href');

        var newDeleteUserLink = deleteUserLink.replace("UserNameToRaplace", userName);
        var newChangePassUserLink = changePassUserLink.replace("UserNameToRaplace", userName);

        var deleteUserLink = $("#DeleteUser").attr('href', newDeleteUserLink);
        var changePassUserLink = $('#ChangePass').attr('href', newChangePassUserLink);
    };
</script>