How to add field validation rules in KANBAN dialog template

[Hugo Zhao]

Hi,

https://blazor.syncfusion.com/documentation/kanban/dialog/

for example, how to make the field Summary can not empty. Thanks

[Nevitha Ravi]

Hi Hugo, 

Greetings from Syncfusion Support. 

Currently we don’t have in-built field validation for Kanban fields, so we have prepared a sample using EditForm for your reference which can be downloaded from the following link. 

https://www.syncfusion.com/downloads/support/forum/161461/ze/KanbanFieldValidation1811259682  

CardValidation = (TasksModel)context; 

                <EditForm Model="CardValidation" Context="FormCcontext" OnValidSubmit="OnSubmit"> 

                    <DataAnnotationsValidator /> 

                    <ValidationSummary /> 

                    <table> 

                        <tbody> 

                          … 

                            <tr> 

                                <td class="e-label">Summary</td> 

                                <td> 

                                    <SfTextBox @ref="SummaryRef" CssClass="e-field" Multiline="true" @bind-Value="@CardValidation.Summary"></SfTextBox> 

                                    <ValidationMessage For="@(() => CardValidation.Summary)" /> 

                                </td> 

                            </tr> 

                        </tbody> 

                    </table> 

                    <div class="custom-footer"> 

                        <SfButton CssClass="e-primary e-flat" Content="Save"></SfButton> 

                    </div> 

                </EditForm> 

 

<style> 

//to position the custom save button 

    .custom-footer { 

        text-align: right; 

        position: absolute; 

        width: 247px; 

        bottom: 15px; 

    } 

//to hide default save button  

    .e-dialog .e-footer-content .e-dialog-add {  

        display: none; 

    } 

</style> 

    public TasksModel CardValidation = new TasksModel(); 

    private void OnSubmit() 

    { 

        KanbanRef.AddCard(CardValidation); //to add the card 

        KanbanRef.CloseDialog(); //to hide the dialog 

    } 

Please try the above sample and let us know if you need any further assistance. 

Regards, 

Nevitha 

[Hugo Zhao]

Thank you so much

[Nevitha Ravi]

Hi Hugo, 

You are most welcome..! please get back to us if you need any further assistance. 

Regards, 

Nevitha