Changing column button content depending on values in row

[Martin]

I wish to change the text on a command button depdning on teh value in a filed in a row.

My button definition is:

<GridCommandColumn @ref="userGridAdminBut" Type="CommandButtonType.None" Title="ChangeStuff" ButtonOption="@button_label"   />

I have code as follows:

    CommandButtonOptions button_label { get; set; } = new CommandButtonOptions();

And 

    public async void userGridRowDatabound(RowDataBoundEventArgs<UserInfo> args)

    {

        if ((bool)args.Data.SomeBoolean)

            button_label.Content = "This Stuff";

        else

            button_label.Content = "That Stuff";

    }

The button label does not change in the UI.

Can his be made to work?

Martin

[Vignesh Natarajan]

Hi Martin,  

 

Thanks for contacting Syncfusion support.  

 

Query: “The button label does not change in the UI. Can his be made to work?” 

 

We have analyzed your query and we do not have support to change the GridCommand Button content based on record. So we have achieve your requirement by rendering a custom button component using Cell Template feature of the Grid. 

 

Refer the below code example.  

 

<SfGrid DataSource="@Employees">    <GridColumns>        <GridColumn Field=@nameof(EmployeeData.EmployeeID) HeaderText="Employee ID" TextAlign="TextAlign.Right" Width="120"></GridColumn>        <GridColumn Field=@nameof(EmployeeData.FirstName) HeaderText="First Name" Width="130"></GridColumn>        <GridColumn Field=@nameof(EmployeeData.Title) HeaderText="Title" Width="120"></GridColumn>        <GridColumn Field=@nameof(EmployeeData.HireDate) HeaderText="Hire Date" Format="d" TextAlign="TextAlign.Right" Width="150"></GridColumn>        <GridColumn HeaderText="Grid Actions" TextAlign="TextAlign.Center" Width="120">            <Template>                @{                    var employee = (context as EmployeeData);                    if (employee.HasPermission)                    {                        <SfButton OnClick="BtnHandle" Content="This Stuff"></SfButton>                    }                    else                    {                        <SfButton OnClick="BtnHandle" Content="That Stuff"></SfButton>                    }                }            </Template>        </GridColumn>    </GridColumns></SfGrid>  @code{    public List<EmployeeData> Employees { get; set; }    public void BtnHandle()    {     }

 

Kindly download the sample from below which we have prepared using above solution.  

 

Sample:  https://www.syncfusion.com/downloads/support/forum/163201/ze/DataGrid888858286  

 

Refer our UG documentation for your reference 

 

https://blazor.syncfusion.com/documentation/datagrid/columns/#column-template  

 

Please get back to us if you have further queries.  

 

Regards, 

Vignesh Natarajan  

  

[Padmini Ramamurthy]

From: Martin Newman 
Sent: Friday, March 5, 2021 6:59 AM
To: Syncfusion Support <[email protected]>
Subject: RE: Syncfusion support community forum 163201, Changing column button content depending on values in row, has been updated. 

  

Many thanks – that looks perfect.  Will try that. 

[Martin]

How can I get the value of a row field from inside the BtnHandle method?

[Renjith Singh Rajendran]

Hi Martin, 

We suggest you to pass the context value in OnClick event as like the below code to achieve this requirement. Please refer the below highlighted codes, 

 

<GridColumn HeaderText="Grid Actions" TextAlign="TextAlign.Center" Width="120"> 

    <Template> 

        @{ 

            var employee = (context as EmployeeData); 

            if (employee.HasPermission) 

            { 

                <SfButton OnClick="() => BtnHandle(employee)" Content="This Stuff"></SfButton> 

            } 

            else 

            { 

                <SfButton OnClick="()=>BtnHandle(employee)" Content="That Stuff"></SfButton> 

            } 

        } 

    </Template> 

</GridColumn> 

public void BtnHandle(EmployeeData employee){ }

Please get back to us if you need further assistance. 

Regards, 

Renjith Singh Rajendran 

[Martin]

Thanks that works

[Renjith Singh Rajendran]

Hi Martin, 

We are glad to hear that the suggested solution helped you in achieving this requirement. Please get back to us if you need further assistance. 

Regards, 

Renjith R