How to use Validation for Custom component within EditForm

I have used Validation in EditForm (For sfCombobox/sfTextbox etc).It works fine as per my requirement (when Click on submit button).When I use Custom Component within EditForm,the validation message is still showing even when we enter some value.Please advise how to use validation message for custom component



Code: -


<div class="col-sm-12 col-md-12 col-lg-12">
                                <MaterialSearchVertical @ref="materialSearchVertical" EditEnabled="@EditEnabled" MaterialTypeID="materialRequestDetailDisplaySetup.MaterialTypeID"
                                                PurchaseTypeID="materialRequestSetup.PurchaseTypeID"
                                                MaterialSKUID="materialRequestDetailDisplaySetup.MaterialSKUID"
                                                MaterialTypeLoad=" AND A.ReferenceDetailsCode in ('SUMAT','MNT','HLTS') "
                                                EventCallBackMaterialSearch="MaterialSearchEventCallBack"></MaterialSearchVertical>
                                <ValidationMessage For="@(() => materialRequestDetailDisplaySetup.MaterialSKUID)" />
                            </div>



Component Code: -

@inherits MaterialSearchVerticalBase


<div class="col-sm-12 col-md-12 col-lg-12" style="padding:0px">

    <SfComboBox Enabled="@EditEnabled" CssClass="required" @ref="cmbMaterialType" DataSource="@materialTypeSetups" @bind-Value="@MaterialTypeID" Placeholder="Material Type"

                    FilterType="Syncfusion.Blazor.DropDowns.FilterType.Contains" AllowFiltering="true" FloatLabelType="@FloatLabelType.Always" ShowClearButton="true">

        <ComboBoxFieldSettings Value="ReferenceDetailsID" Text="ReferenceDetailsName"></ComboBoxFieldSettings>

        <ComboBoxEvents TValue="int?" TItem="SReferenceDetailsSetup" ValueChange="@MaterialTypeChange"></ComboBoxEvents>

    </SfComboBox>


</div>


<div class="col-sm-12 col-md-12 col-lg-12" style="padding:0px">

    <SfComboBox Enabled="@EditEnabled" CssClass="e-multi-column required" @ref="cmbMaterialSKU" Query="@query" TValue="int?" TItem="MaterialSKUSearchSetup" @bind-Value="@internalMaterialSKUID" PopupWidth="1150px" Placeholder="Material SKU"

                    FilterType="Syncfusion.Blazor.DropDowns.FilterType.Contains" AllowFiltering="true" FloatLabelType="@FloatLabelType.Always" EnableVirtualization="true" >

        <SfDataManager @ref="sfData" Json="@materialSKUSearchSetups" Adaptor="Adaptors.JsonAdaptor"></SfDataManager>

        <ComboBoxFieldSettings Text="MaterialSKUName" Value="MaterialSKUID"></ComboBoxFieldSettings>

        <ComboBoxEvents TValue="int?" TItem="MaterialSKUSearchSetup" ValueChange="@MaterialSKUChange" Filtering="OnFiltering"></ComboBoxEvents>

        <ComboBoxTemplates TItem="MaterialSKUSearchSetup">

            <HeaderTemplate>

                <table class="table-header">

                    <thead>

                        <tr>

                            <th width="350px" class="e-text-center">MaterialName</th>

                            <th width="100px">Source</th>

                            <th width="100px">Uom</th>

                            <th width="150px">MaterialCode</th>

                            <th width="200px">Main Group</th>

                            <th width="100px">CM No</th>

                            <th width="150px">Vendor Code</th>

                        </tr>

                    </thead>

                </table>

            </HeaderTemplate>

            <ItemTemplate Context="context2">

                <table class="table-body">

                    <tbody>

                        <tr>

                            <td width="350px" style="height:none" class="e-text-center">@((context2 as MaterialSKUSearchSetup).MaterialSKUName)</td>

                            <td width="100px">@((context2 as MaterialSKUSearchSetup).SourceName)</td>

                            <td width="100px">@((context2 as MaterialSKUSearchSetup).UomName)</td>

                            <td width="150px">@((context2 as MaterialSKUSearchSetup).MaterialSKUCode)</td>

                            <td width="200px">@((context2 as MaterialSKUSearchSetup).MainGroupName)</td>

                            <td width="100px">@((context2 as MaterialSKUSearchSetup).CMNo)</td>

                            <td width="150px">@((context2 as MaterialSKUSearchSetup).VendorCode)</td>

                        </tr>

                    </tbody>

                 </table>

            </ItemTemplate>

        </ComboBoxTemplates>

        <ValidationMessage For="@(() =>@internalMaterialSKUID)" />

    </SfComboBox>

</div>



1 Reply

UD UdhayaKumar Duraisamy Syncfusion Team December 6, 2022 07:12 AM UTC

You can find more information about "How to use Validation for Custom Component within EditForm" in the Syncfusion forum linked below. 


https://www.syncfusion.com/forums/169085/validation-of-child-component?reply=SoHuMh



Loader.
Up arrow icon