EditForm validation with strange behavior

[Brice FROMENTIN]

In my sample :

• Adresse : The tooltip display validation message but never becomes empty if I fill the field.
• Adresse 2 : If I had a SfTextBox on the same field, the Tooltip becomes empty.
• EMail : Works as expected.

I use a component to encapsulate the tooltip / textbox but I am unable to understand why it does not update.

Thanks.

Attachment: SfTextboxValidation_f76de250.7z

[Ponmani Murugaiyan]

Hi Brice, 

 

Greetings from Syncfusion support. 

 

We have prepared a sample based on this scenario. Please download the sample from the link below,  

 

Sample : https://www.syncfusion.com/downloads/support/directtrac/general/ze/ServerSample214679950  

 

We have used the SfTooltip to make the validation message to get displayed as like our default edit form validation message tooltip. We have opened the tooltip based on the Validate() by using Open() and closed the tooltip using Close(), so that the tooltip validation message gets displayed only when needed.   

 

Please refer and use as like the codes below,  

 

EditForm EditContext="EC"> 

    <ValidationSummary Model="employee" /> 

    <DataAnnotationsValidator /> 

    <div class="row"> 

        <SfTooltip @ref="tooltipObj" Target="ToolText" OffsetX="tipx" OffsetY="tipy" OpensOn="Custom"> 

            <SfTextBox Placeholder="Test Property" CssClass="@cssClass" ID="ToolText" FloatLabelType='@FloatLabelType.Always' @bind-Value="employee.Name" Blur="TestPropertyBlurEvent"></SfTextBox> 

            <TooltipTemplates> 

                <Content> 

                    <ValidationMessage For="@(() => employee.Name)"></ValidationMessage> 

                </Content> 

            </TooltipTemplates> 

        </SfTooltip> 

    </div> 

    <SfButton IsPrimary="true" OnClick="@(() => SaveClick())">Save</SfButton> 

</EditForm> 

 

@code { 

    private Employee employee { get; set; } = new Employee(); 

    private EditContext EC { get; set; } 

    SfTooltip tooltipObj; 

    private double tipx { get; set; } 

    private double tipy { get; set; } 

    private string cssClass { get; set; } 

    protected override Task OnInitializedAsync() 

    { 

        EC = new EditContext(employee); 

        return base.OnInitializedAsync(); 

        tipx = -99999; 

        tipy = -99999; 

    } 

    ... 

    public class Employee 

    { 

        [Required(ErrorMessage = "Field is required.")] 

        public string Name { get; set; } 

    } 

} 

 

 

We have considered as feature request for this requirement. We have tentatively planned to include in any of the upcoming release. We appreciate your patience until then.   

  

You can now track the status of feature in the below link.  

 

Feedback : https://www.syncfusion.com/feedback/11397/provide-support-for-form-validation-plugin-in-blazor-platform    

 

Regards, 

Ponmani M 

[Brice FROMENTIN]

Thanks for your answer, my problem was not inheriting InputBase

[Ponmani Murugaiyan]

Hi Brice, 

Thanks for your patience. 

As per our previous update, after the validation has been satisfied need to close the tooltip in order to remove the tooltip for your mentioned case1  “The tooltip display validation message but never becomes empty if I fill the field”. So we request you to close the tooltip by calling the Close() method of tooltip as like our previously provided sample to get rid of the reported issue. 

Regards, 

Ponmani M