Query in grid edit dialog - from 195023

I checked in the link below that there is a dialog for NEW , UPDATE . Is there display-only and read-only dialog? that the user will be displayed after double-clicking on the row?


https://blazor.syncfusion.com/demos/datagrid/grid-dialog-template?theme=bootstrap5


1 Reply

PS Prathap Senthil Syncfusion Team November 8, 2024 03:51 PM UTC

Hi Sarah,

Based on your requirements for a display-only dialog or a read-only editor for specific fields, we recommend using conditions to set fields as display-only based on your use case. For fields that need to be read-only in the editor, you can set the Enabled property to false to achieve the desired behavior. Please refer to the code snippet and sample below for reference.

 

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

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

        <Template>

            @{

                var Order = (context as OrdersDetails);

                <div style="width:305px; height:380px;">

                    <label>Order ID</label>

                    <SfNumericTextBox ID="OrderID" @bind-Value="@(Order.OrderID)" Enabled="@((Order.OrderID == null) ? true : false)"></SfNumericTextBox>

 

 

                    <label>Customer Name</label>

                    <SfAutoComplete ID="customerID" TItem="OrdersDetails" @bind-Value="@(Order.CustomerID)" Enabled="false" TValue="string" DataSource="@GridData">

                        <AutoCompleteFieldSettings Value="CustomerID"></AutoCompleteFieldSettings>

                    </SfAutoComplete>

 

                    @if (Order.OrderID != 10248)

                    {

                        <label>Freight</label>

                        <SfNumericTextBox ID="Freight" @bind-Value="@(Order.Freight)" TValue="double?"></SfNumericTextBox>

 

                    }

               

                    <label>Order Date</label>

                    <SfDatePicker ID="OrderDate" @bind-Value="@(Order.OrderDate)" ></SfDatePicker>

 

                    <label>Ship Country</label>

                    <SfDropDownList ID="ShipCountry" @bind-Value="@(Order.ShipCountry)" TItem="OrdersDetails" TValue="string" DataSource="@GridData">

                        <DropDownListFieldSettings Value="ShipCountry" Text="ShipCountry"></DropDownListFieldSettings>

                    </SfDropDownList>

 

                    <label>Ship City</label>

                    <SfDropDownList ID="ShipCity" @bind-Value="@(Order.ShipCity)"  TItem="OrdersDetails" TValue="string" DataSource="@GridData">

                        <DropDownListFieldSettings Value="ShipCity" Text="ShipCity"></DropDownListFieldSettings>

                    </SfDropDownList>

 

                    <label>Ship Address</label>

                    <SfTextBox ID="ShipAddress" @bind-Value="@(Order.ShipAddress)"></SfTextBox>

                </div>

            }

        </Template>

    </GridEditSettings>


Sample:https://blazorplayground.syncfusion.com/embed/BjLzsitPeAhiFqzc?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5


Regards,
Prathap Senthil


Loader.
Up arrow icon