How to change edit dialog header text after v18.2.0.44

[David Adler]

I am using SyncFusion.Blazor v18.2.0.44. Prior to updating to that version, I was able to set the  text of the Grid's Edit template as follows;

 In the .razor file, I have the following 

    <GridEditSettings AllowEditing="true" Dialog="DialogParams" Mode="EditMode.Dialog">

        <Template>

            @{

                var lineItem = (context as OrderLineItem);

                <div width="400px">

                    <div class="row">

                        <div class="col-12">

                            <div class="form-group">

                                <label>Product</label>

                                <SfTextBox ID="Product" @bind-Value="@(lineItem.ProductName)" Enabled="false"></SfTextBox>

                            </div>

                        </div>

                    </div>

                    <div class="row">

                        <div class="col-4">

                            <div class="form-group">

                                <label>Qty</label>

                                <SfNumericTextBox ID="Quantity" @bind-Value="@(lineItem.UnitQuantity)" Enabled="true" ShowSpinButton=true Format="n0" Min="0">

                                </SfNumericTextBox>

                            </div>

                        </div>

                        <div class="col-8">

                        </div>

                    </div>

                </div>

            }

        </Template>

    </GridEditSettings>

Then in the *.razor.cs file, I had the following;

        protected object DialogParams { get; set; } = new

        {

            @params = new DialogModel

            {

                Header = "Edit Product Quantity",

                Width = "400px",

            },

        };

Now, with the v18.2.0.44 update, I had to change the DialogParams as follows;

        protected DialogSettings DialogParams { get; set; } = new DialogSettings

        {

            //Header = "Edit Product Quantity",

            Width = "400px",

        };

DialogSettings does not have a property for Header so now I can no longer set the header text of the edit dialog.

How can I now set the Header text?

[Rahul Narayanasamy]

Hi David, 

Greetings from Syncfusion. 

Query: How to change edit dialog header text after v18.2.0.44 

We have validated your query and you want to change the dialog header in latest version. You can achieve your requirement by using HeaderTemplate property in GridEditSettings. Find the below code snippets and sample for your reference. 

 

<SfGrid DataSource="@GridData" Toolbar="@(new string[] {"Add", "Edit" ,"Delete","Update","Cancel" })"> 

    <GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true" Mode="@EditMode.Dialog" Dialog="DialogParams"> 

        <HeaderTemplate> 

            @{ 

                var text = GetHeader((context as OrdersDetails)); 

                <span>@text</span> 

            } 

        </HeaderTemplate> 

        <Template> 

            @{ 

                . . . 

            } 

        </Template> 

    </GridEditSettings> 

    <GridColumns> 

        <GridColumn Field=@nameof(OrdersDetails.OrderID) HeaderText="Order ID" IsPrimaryKey="true" TextAlign="@TextAlign.Center" HeaderTextAlign="@TextAlign.Center" Width="140"></GridColumn> 

        . . . 

    </GridColumns> 

</SfGrid> 

 

@code{ 

    . . . 

    protected DialogSettings DialogParams { get; set; } = new DialogSettings 

    { 

        //Header = "Edit Product Quantity", 

        Width = "400px", 

    }; 

    public string GetHeader(OrdersDetails Value) 

    { 

        if (Value.OrderID == null) 

        { 

            return "Insert New Order"; 

        } 

        else 

        { 

            return "Edit Record Details of " + Value.OrderID.ToString(); 

        } 

    } 

} 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/BlazorAppDialogHeader-46286684  

Please get back to us if you need further assistance. 

Regards, 

Rahul