We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Button außerhalb von EditForm

Dear Syncfusion-Team,

I have a problem to send EditForm data. I want to do it with a button outside the EditForm. Can you help me?

Here is my code:

//This is the button outside the EditForm and with this Button i want to submit the data from EditForm

<SfButton class="saveButton e-control e-btn e-primary" >Save</SfButton>

<EditForm Model="@dbContent" OnValidSubmit="HandleSubmit">

                <DataAnnotationsValidator />

                <ValidationSummary />

                <div class="form-group">

                    <label for="title">Newstitel</label>

                    <SfTooltip ID="Tooltip" CssClass="info" Target="#btn" Content="@Content" Position="Position.TopRight">

                    <SfTextBox CssClass="newsCreateField" ID="title" @bind-Value="dbContent.Title"></SfTextBox>

                        <SfIcon ID="btn" Content="Show Tooltip" Name="IconName.CircleInfo"></SfIcon>

                    </SfTooltip>

                    <label for="file-attachment">Anhang</label>

                    <SfTooltip ID="Tooltip" CssClass="info" Target="#btn" Content="@ContentFileAttachment" Position="Position.TopRight">

                    <SfUploader CssClass="newsCreateField" EnableRtl="true">

                        <UploaderEvents Created="@CreatedHandler"></UploaderEvents>

                    </SfUploader>

                    <SfIcon ID="btn" Content="Show Tooltip" Name="IconName.CircleInfo"></SfIcon>

                    </SfTooltip>

                    <label for="link">Verlinkung</label>

                    <SfTooltip ID="Tooltip" CssClass="info" Target="#btn" Content="@ContentLink" Position="Position.TopRight">

                    @*<SfTextBox CssClass="newsCreateField" ID="link" @bind-Value="newsData.Link" @ref="@TextBoxLinkObj" Created="@OpenLink"></SfTextBox>*@

                    <SfIcon ID="btn" Content="Show Tooltip" Name="IconName.CircleInfo"></SfIcon>

                    </SfTooltip>

                    <label for="titlePicture">Titelbild</label>

                    <SfButton class="selectImage e-control e-btn e-primary"><SfIcon Name="IconName.Link"></SfIcon>Bild auswählen</SfButton>

                    <SfUploader CssClass="newsCreateField" AllowedExtensions=".png,.jpeg,.jpg">

                        <UploaderButtons Browse="Bilder hochladen"></UploaderButtons>

                        @* <UploaderEvents Created="@CreatedHandler"></UploaderEvents> *@

                    </SfUploader>

                    <label for="content">Inhalt</label>

                    <div class="richTextEditor">

                        <SfRichTextEditor ShowCharCount="true" EnableResize="true">

                            <ChildContent>

                                <RichTextEditorToolbarSettings Items="@Tools"></RichTextEditorToolbarSettings>

                            </ChildContent>

                        </SfRichTextEditor>

                    </div>

                <SfButton class="saveButton e-control e-btn e-primary">Speichern</SfButton>

                </div>

            </EditForm>


@code{

DbContent dbContent = new DbContent();


 public void HandleSubmit(EditContext editContext)

    {

        var newContent = (DbContent)editContext.Model;

        contentSrv.AddContentService(newContent);

    }

}


1 Reply

UD UdhayaKumar Duraisamy Syncfusion Team November 14, 2022 05:46 AM

You have to define and bind the EditContext with EditForm and then call the method editContext.Validate() on button click to manually trigger the validation.


Refer to the below shared public blog for more information.

How do you manually trigger the form validation in Blazor?


Loader.
Live Chat Icon For mobile
Up arrow icon