Question on Handling ValidSubmit in ChildContent, #50

jpiell · 2020-01-31T14:40:17Z

Child Component contains:

. . . . Save

Test Contains:

        var cut = RenderComponent<TelerikRootComponent>(
            ChildContent<Lookup>(),
            CascadingValue("GridData", lookupEntities),
            CascadingValue("LookupName", "Item")
            );

        cut.Find("#Add_button").Click();
        cut.Find("#Name_textbox").InnerHtml = name;
        cut.Find("#Description_textarea").InnerHtml = description;
        cut.Find("#Save_button").Click(); <-- Wants an onclick

The click event should fire the OnValidSubmit.

I am unsure how to get this to work.

Any help would be appreciated.

Thanks,

Jeff

The text was updated successfully, but these errors were encountered:

egil · 2020-02-01T20:02:19Z

You likely have to trigger the forms submit event handler, not the submit button. E.g. cut.Find("form").Submit().

I think it might be worth enhancing the Click() logic such that if a submit button is clicked, if it does not have a event handler itself and the form it belongs to do, then the forms submit event handler is triggered.

jpiell · 2020-02-01T20:06:28Z

I tried Submit as well. Submit required an on submit event handler. Remember the component sets the OnValidSubmit property.

…

On Sat, Feb 1, 2020 at 3:02 PM Egil Hansen ***@***.***> wrote: You likely have to trigger the forms submit event handler, not the submit button. E.g. cut.Find("form").Submit(). I think it might be worth enhancing the Click() logic such that if a submit button is clicked, if it does not have a event handler itself and the form it belongs to do, then the forms submit event handler is triggered. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#50>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AHE7FB5Z7QYUTSDCYMRWJCLRAXIMXANCNFSM4KOICV6A> .

egil · 2020-02-01T20:10:33Z

Ok. Try setting a break point in your test, and inspect cut.Markup. That should show you the raw rendered markup, and you can look for attributes prefixed with "blazor" for possible triggers available to you.

Post the cut.Markup here if you need more help.

jpiell · 2020-02-01T20:16:10Z

It has blazor click=“12” like that. Generated.

…

Sent from my iPhone

On Feb 1, 2020, at 3:10 PM, Egil Hansen ***@***.***> wrote: Ok. Try setting a break point in your test, and inspect cut.Markup. That should show you the raw rendered markup, and you can look for attributes prefixed with "blazor" for possible triggers available to you. Post the cut.Markup here if you need more help. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or unsubscribe.

egil · 2020-02-02T06:27:57Z

Well, in that case, you can use the .Click() on the element that had the blazor attribute.

jpiell · 2020-02-02T10:56:54Z

Isn’t the click element generated by Blazor? If so, I would not be guaranteed the Click handler generate the same on each successive run. From: Egil Hansen <notifications@github.com> Sent: Sunday, February 2, 2020 1:28 AM To: egil/razor-components-testing-library <razor-components-testing-library@noreply.github.com> Cc: jpiell <jpiell@gmail.com>; Author <author@noreply.github.com> Subject: Re: [egil/razor-components-testing-library] Question on Handling ValidSubmit in ChildContent, (#50) Well, in that case, you can use the .Click() on the element that had the blazor attribute. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#50> , or unsubscribe <https://github.com/notifications/unsubscribe-auth/AHE7FBZ6PWXZQVFRB2K5KATRAZRW3ANCNFSM4KOICV6A> . <https://github.com/notifications/beacon/AHE7FB7J5T7MQGNGRAK5F5DRAZRW3A5CNFSM4KOICV6KYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEKRPBMY.gif>

egil · 2020-02-03T09:47:20Z

The number in the blazor attribute is just used to tie the event handler to the binding. It is generated, but if you call Click() on the same element each time, then the same trigger should be called.

jpiell · 2020-02-03T10:48:42Z

Ok I will try that tomorrow. If I am still having trouble after trying that, I will paste the markup in the issue. Thanks again. Jeff

…

Sent from my iPhone

On Feb 3, 2020, at 4:47 AM, Egil Hansen ***@***.***> wrote: The number in the blazor attribute is just used to tie the event handler to the binding. It is generated, but if you call Click() on the same element each time, then the same trigger should be called. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or unsubscribe.

jpiell · 2020-02-04T12:57:55Z

Ok - I am trying cut.Find("#Save_button").Submit();

This throws:

System.ArgumentException
HResult=0x80070057
Message=The element does not have an event handler for the event 'onsubmit'.
Source=Egil.RazorComponents.Testing.Library
StackTrace:
at Egil.RazorComponents.Testing.EventDispatchExtensions.GeneralEventDispatchExtensions.TriggerEventAsync(IElement element, String eventName, EventArgs eventArgs)
at Egil.RazorComponents.Testing.EventDispatchExtensions.InputEventDispatchExtensions.SubmitAsync(IElement element)
at Egil.RazorComponents.Testing.EventDispatchExtensions.InputEventDispatchExtensions.Submit(IElement element)
at TIPS.ComponentTests.CommonComponentTests.LookupRendersCorrectlyAddItem() in C:\Projects\TIPS\TIPS.ComponentTests\Common.Components\CommonComponentTests.cs:line 336

Here is the cut.Markup:

<header>
   <h1 class="h3"> Management</h1>
</header>
<div class="mb-2">
   <button id="Add_button" class="btn btn-primary" blazor:onclick="1"><span class="oi oi-plus mr-2"></span>Add </button>
</div>
<div class="contentWrapper fade-in">
   <div id="0bd29dd7-9e93-4905-85e9-ee56ae38c10a" class="k-grid k-widget telerik-blazor" style="">
      <div class="k-grid-header" id="8a790449-04a5-41f2-9009-3307b0ef8828">
         <div class="k-grid-header-wrap">
            <table role="grid" style="width: ;">
               <colgroup>
                  <col style="width: 250px" />
                  <col style="width: " />
                  <col style="width: 100px" />
                  <col style="width: 200px" />
                  <col style="width: 130px" />
               </colgroup>
               <thead role="rowgroup">
                  <tr role="row">
                     <th colspan="1" class="k-header" data-role="columnsorter">
                        <span class="k-link" blazor:onclick="2">
                        Name
                        </span>
                        <div id="faa72a8f-e6dc-4513-bfcc-b1d320dca5d7" class="k-grid-filter ">
                           <span class="k-icon k-i-filter"></span>
                        </div>
                     </th>
                     <th colspan="1" class="k-header" data-role="columnsorter">
                        <span class="k-link" blazor:onclick="3">
                        Description
                        </span>
                        <div id="8e76869c-3b3a-496f-8d52-c84f7f63a965" class="k-grid-filter ">
                           <span class="k-icon k-i-filter"></span>
                        </div>
                     </th>
                     <th colspan="1" class="k-header" data-role="columnsorter">
                        <span class="k-link" blazor:onclick="4">
                        Active
                        </span>
                        <div id="e075f1c9-67c1-48da-9a80-fb3adf77011a" class="k-grid-filter ">
                           <span class="k-icon k-i-filter"></span>
                        </div>
                     </th>
                     <th colspan="1" class="k-header" data-role="columnsorter">
                        <span class="k-link" blazor:onclick="5">
                        Date
                        </span>
                        <div id="ad22b32d-4033-4c20-b982-94d68000e4f7" class="k-grid-filter ">
                           <span class="k-icon k-i-filter"></span>
                        </div>
                     </th>
                     <th colspan="1" class="k-header" data-role="columnsorter">
                        <span class="k-link" blazor:onclick="6">
                        Action
                        </span>
                     </th>
                  </tr>
               </thead>
            </table>
         </div>
      </div>
      <div class="k-grid-container">
         <div class="k-grid-content k-virtual-content" id="6ff53f79-f92e-4e65-87b9-e80c6562dd98">
            <div style="position: relative;">
               <div class="k-virtual-position" style="" data-translate="0" data-total="0">
                  <table data-role="grid" role="grid" class="k-grid-table" style="height: auto; width: ;">
                     <colgroup>
                        <col style="width: 250px;" />
                        <col style="width: ;" />
                        <col style="width: 100px;" />
                        <col style="width: 200px;" />
                        <col style="width: 130px;" />
                     </colgroup>
                     <tbody role="rowgroup">
                     </tbody>
                  </table>
               </div>
            </div>
            <div class="k-height-container">
               <div style=""></div>
            </div>
         </div>
      </div>
      <div class="k-pager-wrap k-grid-pager k-widget k-floatwrap telerik-blazor" data-role="pager">
         <span blazor:onclick="7" aria-label="Go to the first page" title="Go to the first page" class="k-link k-pager-nav k-state-disabled" tabindex="-1">
         <span class="k-icon k-i-arrow-end-left"></span>
         </span>
         <span blazor:onclick="8" aria-label="Go to the previous page" title="Go to the previous page" class="k-link k-pager-nav k-state-disabled" tabindex="-1">
         <span class="k-icon k-i-arrow-60-left"></span>
         </span>
         <ul class="k-pager-numbers k-reset">
         </ul>
         <span blazor:onclick="9" aria-label="Go to the next page" title="Go to the next page" class="k-link k-pager-nav k-state-disabled" tabindex="-1">
         <span class="k-icon k-i-arrow-60-right"></span>
         </span>
         <span blazor:onclick="10" aria-label="Go to the last page" title="Go to the last page" class="k-link k-pager-nav k-state-disabled" tabindex="-1">
         <span class="k-icon k-i-arrow-end-right"></span>
         </span>
         <span class="k-pager-info k-label">
         0 - 0 of 0 items
         </span>
      </div>
   </div>
</div>
<div class="k-dialog-wrapper">
   <div class="k-overlay"></div>
   <div class="k-widget k-window k-window-wrapper telerik-blazor k-centered  " style="width: 800px;" role="dialog">
      <div class="k-window-titlebar k-dialog-titlebar k-header">
         <div class="k-window-title k-dialog-title">
            <strong>Add </strong>
         </div>
      </div>
      <div class="k-content k-window-content k-dialog-content" tabindex="0" role="dialog">
         <form blazor:onsubmit="11">
            <div class="form-group ">
               <label class="control-label" for="Name">
               Name
               </label>
               <input class="form-control" id="Name_textbox" name="Name" type="text" blazor:onchange="12" />
            </div>
            <div class="form-group ">
               <label class="control-label" for="Description">
               Description
               </label>
               <textarea class="form-control" id="Description_textarea" name="Description" rows="7" blazor:onchange="13"></textarea>
            </div>
            <div class="pb-2 pt-2">
               <div class="mat-switch mdc-switch mdc-switch--checked" style="" Id="matBlazor_id_b6c1933d-56fa-486a-96b3-efc73afb4862" blazor:elementreference="64a55ed8-e5f2-4301-ad92-3c54d589b686">
                  <div class="mdc-switch__track"></div>
                  <div class="mdc-switch__thumb-underlay">
                     <div class="mdc-switch__thumb">
                        <input type="checkbox" id="matBlazor_id_b6c1933d-56fa-486a-96b3-efc73afb4862" class="mdc-switch__native-control" role="switch" checked blazor:onchange="15" blazor:elementreference="a6444ba6-7c8c-4ffa-a01b-b86f01984e42"></input>
                     </div>
                  </div>
               </div>
               <label for="matBlazor_id_b6c1933d-56fa-486a-96b3-efc73afb4862">&#xA0;Active</label>
            </div>
            <div class="d-flex flex-row-reverse">
               <button id="Save_button" type="submit" class="btn btn-primary ml-2">Save</button>
               <button id="Cancel_button" type="button" class="btn btn-light ml-2" blazor:onclick="14">Cancel</button>
            </div>
         </form>
      </div>
   </div>
</div>
<div class="telerik-blazor k-animation-container " id="c19ee251-a6e1-40d0-b72d-fd63748faece" style="width: ; z-index: 10002; "></div>
<div class="telerik-blazor k-animation-container " id="6354648f-c6ad-457b-be19-f5ce3f4a1d29" style="width: ; z-index: 10002; "></div>
<div class="telerik-blazor k-animation-container " id="914ce7fd-08e6-4ee9-b32a-fc24ea72380b" style="width: ; z-index: 10002; "></div>
<div class="telerik-blazor k-animation-container " id="5459e71b-70af-472c-aadb-578f0df301af" style="width: ; z-index: 10002; "></div>

I do see the

How can I specify this as the submit handler? It has not been generated util run time. Do I use a lambda?

egil · 2020-02-04T13:29:47Z

I am not familier with the Telerik controls, so I cannot be sure, but if you are trying to submit the <form blazor:onsubmit="11"> at the bottom part of the markup, you need to use Submit() I think. At least it looks as if Blazor has added an onSubmit binding to that form. So e.g. cut.Find("form").Submit().

Btw. Please use markdown and take the time to format your code snippets when posting issues here on Github. I edited your previous comment to make the markup easier to read.
It makes it much easier to help you. Google can help you find the documentation you need.

jpiell · 2020-02-04T19:35:45Z

Sorry about the formatting. When I call cut.Find("form").Submit(); the handler for OnValidSubmit="SaveAsync" does not get called. One thing to note is this has nothing to do with Telerik This is all being done outside of the grid control. Just a standard Edit Form: <EditForm Model="SelectedGridItem" OnValidSubmit="SaveAsync"> SelectedGridItem is a ViewModel object.

…

On Tue, Feb 4, 2020 at 8:29 AM Egil Hansen ***@***.***> wrote: I am not familier with the Telerik controls, so I cannot be sure, but if you are trying to submit the <form blazor:onsubmit="11"> at the bottom part of the markup, you need to use Submit() I think. At least it looks as if Blazor has added an onSubmit binding to that form. So e.g. cut.Find("form").Submit(). Btw. please use markdown and take the time to format your code snippets when posting issues here on Github. It makes it much easier to help you. Google can help you find the documentation you need. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#50>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AHE7FB46DPLIPYGHXKSCZPTRBFUUXANCNFSM4KOICV6A> .

egil · 2020-02-04T20:42:50Z

OK. To understand whats going on, you will have to post your CUT as well, so I can inspect the razor/c# code you have written. If you cannot share your code, then please provide a minimum example where this issue is present (this is the preferred way anyway). That will make it much easier for me to help and potentially fix any problems.

See the issue template for bug report for the type of information I generally prefer having available to help effectively: https://github.com/egil/razor-components-testing-library/issues/new/choose

jpiell · 2020-02-05T11:55:35Z

<header>
    <h1 class="h3"> Management</h1>
</header>
<div class="mb-2">
    <button id="Add_button" class="btn btn-primary" blazor:onclick="1"><span class="oi oi-plus mr-2"></span>Add </button>
</div>
<div class="contentWrapper fade-in">
<div id="d85d3145-091f-449b-9976-8263b7945b41" class="k-grid k-widget telerik-blazor" style="">
    <div class="k-grid-header" id="cbcfd24d-bbb6-4679-942d-a223dd523aef">
        <div class="k-grid-header-wrap">
            <table role="grid" style="width: ;">
                <colgroup>
                    <col style="width: 250px" />
                    <col style="width: " />
                    <col style="width: 100px" />
                    <col style="width: 200px" />
                    <col style="width: 130px" />
                </colgroup>
                <thead role="rowgroup">
                    <tr role="row">
                        <th colspan="1" class="k-header" data-role="columnsorter">
                            <span class="k-link" blazor:onclick="2">
                                Name
                            </span>
                            <div id="f9934efe-b945-482c-9e1d-5e5e55ad17dc" class="k-grid-filter ">
                                <span class="k-icon k-i-filter"></span>
                            </div>
                        </th>
                        <th colspan="1" class="k-header" data-role="columnsorter">
                            <span class="k-link" blazor:onclick="3">
                                Description
                            </span>
                            <div id="f0062488-616d-435b-beed-c3e3c5ca4c7e" class="k-grid-filter ">
                                <span class="k-icon k-i-filter"></span>
                            </div>
                        </th>
                        <th colspan="1" class="k-header" data-role="columnsorter">
                            <span class="k-link" blazor:onclick="4">
                                Active
                            </span>
                            <div id="f60e8b63-55ce-4a93-ab9b-521efc35f668" class="k-grid-filter ">
                                <span class="k-icon k-i-filter"></span>
                            </div>
                        </th>
                        <th colspan="1" class="k-header" data-role="columnsorter">
                            <span class="k-link" blazor:onclick="5">
                                Date
                            </span>
                            <div id="82416859-1d19-42d2-959c-e0f3985128b2" class="k-grid-filter ">
                                <span class="k-icon k-i-filter"></span>
                            </div>
                        </th>
                        <th colspan="1" class="k-header" data-role="columnsorter">
                            <span class="k-link" blazor:onclick="6">
                                Action
                            </span>
                        </th>
                    </tr>
                </thead>
            </table>
        </div>
    </div>
    <div class="k-grid-container">
        <div class="k-grid-content k-virtual-content" id="59cc1806-2bcc-4287-949d-4bd4bbd75a4c">
            <div style="position: relative;">
                <div class="k-virtual-position" style="" data-translate="0" data-total="0">
                    <table data-role="grid" role="grid" class="k-grid-table" style="height: auto; width: ;">
                        <colgroup>
                            <col style="width: 250px;" />
                            <col style="width: ;" />
                            <col style="width: 100px;" />
                            <col style="width: 200px;" />
                            <col style="width: 130px;" />
                        </colgroup>
                        <tbody role="rowgroup">
                        </tbody>
                    </table>
                </div>
            </div>
            <div class="k-height-container">
                <div style=""></div>
                </div>
            </div>
        </div>
        <div class="k-pager-wrap k-grid-pager k-widget k-floatwrap telerik-blazor" data-role="pager">
            <span blazor:onclick="7" aria-label="Go to the first page" title="Go to the first page" class="k-link k-pager-nav k-state-disabled" tabindex="-1">
                <span class="k-icon k-i-arrow-end-left"></span>
            </span>
            <span blazor:onclick="8" aria-label="Go to the previous page" title="Go to the previous page" class="k-link k-pager-nav k-state-disabled" tabindex="-1">
                <span class="k-icon k-i-arrow-60-left"></span>
            </span>
            <ul class="k-pager-numbers k-reset">
            </ul>
            <span blazor:onclick="9" aria-label="Go to the next page" title="Go to the next page" class="k-link k-pager-nav k-state-disabled" tabindex="-1">
                <span class="k-icon k-i-arrow-60-right"></span>
            </span>
            <span blazor:onclick="10" aria-label="Go to the last page" title="Go to the last page" class="k-link k-pager-nav k-state-disabled" tabindex="-1">
                <span class="k-icon k-i-arrow-end-right"></span>
            </span>
            <span class="k-pager-info k-label">
                0 - 0 of 0 items
            </span>
        </div>
    </div>
</div>
<div class="k-dialog-wrapper">
    <div class="k-overlay"></div>
        <div class="k-widget k-window k-window-wrapper telerik-blazor k-centered  " style="width: 800px;" role="dialog">
            <div class="k-window-titlebar k-dialog-titlebar k-header">
                <div class="k-window-title k-dialog-title">
                    <strong>Add </strong>
                </div>
            </div>
            <div class="k-content k-window-content k-dialog-content" tabindex="0" role="dialog">
                <form blazor:onsubmit="11">
                    <div class="form-group ">
                        <label class="control-label" for="Name">
                            Name
                        </label>
                        <input class="form-control" id="Name_textbox" name="Name" type="text" blazor:onchange="12" />
                    </div>
                    <div class="form-group ">
                        <label class="control-label" for="Description">
                            Description
                        </label>
                        <textarea class="form-control" id="Description_textarea" name="Description" rows="7" blazor:onchange="13"></textarea>
                    </div>
                    <div class="pb-2 pt-2">
                        <div class="mat-switch mdc-switch mdc-switch--checked" style="" Id="matBlazor_id_b85ba47b-dbda-4703-906a-41db7bba0cef" blazor:elementreference="9ba04a76-3974-4adf-b6b7-6293ad940616">
                            <div class="mdc-switch__track"></div>
                            <div class="mdc-switch__thumb-underlay">
                                <div class="mdc-switch__thumb">
                                    <input type="checkbox" id="matBlazor_id_b85ba47b-dbda-4703-906a-41db7bba0cef" class="mdc-switch__native-control" role="switch" checked blazor:onchange="15" blazor:elementreference="16e661e3-4c83-421e-8bde-af07395b17ca"></input>
                                </div>
                            </div>
                        </div>
                        <label for="matBlazor_id_b85ba47b-dbda-4703-906a-41db7bba0cef">&#xA0;Active</label>
                    </div>
                    <div class="d-flex flex-row-reverse">
                        <button id="Save_button" type="submit" class="btn btn-primary ml-2">Save</button>
                        <button id="Cancel_button" type="button" class="btn btn-light ml-2" blazor:onclick="14">Cancel</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
<div class="telerik-blazor k-animation-container " id="3055106e-823e-4713-9bdc-cfd02dce6cac" style="width: ; z-index: 10002; ">
</div>
<div class="telerik-blazor k-animation-container " id="c552f561-9d9b-419e-b748-3aab7ce9cfc7" style="width: ; z-index: 10002; ">
</div>
<div class="telerik-blazor k-animation-container " id="b4493031-0499-41f9-9910-c2f98122b2bd" style="width: ; z-index: 10002; ">
</div>
<div class="telerik-blazor k-animation-container " id="4ce159db-8b71-479d-ad88-171e1527427c" style="width: ; z-index: 10002; ">
</div>

Markup.txt

egil · 2020-02-05T12:31:45Z

Jeff - I want to help you, but you also have to do some work and provide me with the information I need to be able to do so. And you really need to take a look at the GitHub markdown documentation and wrap your markup and code in the appropriate tags - https://guides.github.com/features/mastering-markdown/

As for your latest comment, we already looked at the rendered markup and it does not reveal the problem. Please look at the Bug Issue template for the appropriate information to provide to be able to get help: https://github.com/egil/razor-components-testing-library/issues/new?assignees=&labels=&template=bug_report.md&title=

jpiell · 2020-02-05T19:34:16Z

Egil - I am not familiar with Markdown. I didn't quite grasp the tags and what I should do. I pasted the cut.Markup because you asked me to in your last message.

I think what you are really saying is could I provide a sample app? If this is true, I would be happy to put one together,

Would that help you to figure out when I went wrong?

Also you idea of doing a submit when there is not a click event would most likely be correct as from what I read, it seems like this is the behavior that blazor follows when a button has the type submit and a form has the OnValidSubmit property.

The documentation also states that calling submit on the form will not cause the component to raise the events and that the proper way is clicking the button that has the type submit.

Here is a link to the documentation:
https://docs.microsoft.com/en-us/aspnet/core/blazor/forms-validation?view=aspnetcore-3.1

egil · 2020-02-05T19:54:08Z

Jeff, take a look at the two links in my previous comment. The first is to docs on using markdown in GitHub. Hint, there is a preview button.

The second is a link to the bug report issue template. It should make it clear what you need to provide to make it easy to help you.

jpiell · 2020-02-05T21:52:57Z

I did look at both the links. I still don’t get it. Am I supposed to code my html with markdown tags? Where is there a preview button? The second link I do get. Are you asking me to do a new incident? The template states you would prefer a sample app. That’s why I offered to put one together. From: Egil Hansen <notifications@github.com> Sent: Wednesday, February 5, 2020 2:54 PM To: egil/razor-components-testing-library <razor-components-testing-library@noreply.github.com> Cc: jpiell <jpiell@gmail.com>; Author <author@noreply.github.com> Subject: Re: [egil/razor-components-testing-library] Question on Handling ValidSubmit in ChildContent, (#50) Jeff, take a look at the two links in my previous comment. The first is to docs on using markdown in GitHub. Hint, there is a preview button. The second is a link to the bug report issue template. It should make it clear what you need to provide to make it easy to help you. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#50> , or unsubscribe <https://github.com/notifications/unsubscribe-auth/AHE7FBZLFGYF7H6KNNOPPULRBMKOLANCNFSM4KOICV6A> . <https://github.com/notifications/beacon/AHE7FB7NMIZLPUYEPECBJY3RBMKOLA5CNFSM4KOICV6KYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEK4YEJQ.gif>

egil · 2020-02-06T07:07:12Z

How are you writing your comments here? Are you just replying to the email GitHub sends you?

In that case, I get why you can't figure out markdown or know about the preview button. Please start writing comments and creating issues through github.com, that will make it much easier for everyone to read your comments and you should have a much easier time.

egil · 2020-02-06T07:09:35Z

And yes. I need a minimum example, with as little code as possible to show the issue. Or, alternatively, the things outlined in the bug report template.

egil · 2020-02-11T20:56:18Z

I'll close this issue. If you still need help, just comment again.

andrewmorris-dev · 2020-09-17T01:13:02Z

@egil

What @jpiell is saying is that when you create a form, in blazor, using the parameter OnValidSubmit, it will not cause the cut.Find("form").Submit() to fire.

This works

<EditForm Model="@Model.CreateUserModel" OnSubmit="@CreateUser">
    <button type=submit>
</EditForm>

cut.Find("form").Submit()

This does not work

<EditForm Model="@Model.CreateUserModel" OnValidSubmit="@CreateUser">
    <button type=submit>
</EditForm>

cut.Find("form").Submit()

By the way @jpiell, the reason it's not working for you is that the model associated with your form is not considered a valid one. You're are effectively trying to submit an empty model because of the way you're trying to set the values for your model's fields. You will need to populate the fields for your model like so:

cut.Find("#FirstName").Input("John Doe");

Instead of using InnerHtml. Then you should be able to use the OnValidSubmit. Hope this helps if you haven't already figured it out.

egil · 2020-09-17T06:55:30Z

Thanks for explaining @andrewmorris-dev

egil added enhancement New feature or request question Further information is requested labels Feb 1, 2020

egil mentioned this issue Feb 2, 2020

Make event dispatchers emulate browser behaviour where possible #51

Closed

egil closed this as completed Feb 11, 2020

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Question on Handling ValidSubmit in ChildContent, #50

Question on Handling ValidSubmit in ChildContent, #50

jpiell commented Jan 31, 2020

egil commented Feb 1, 2020

jpiell commented Feb 1, 2020 via email

egil commented Feb 1, 2020

jpiell commented Feb 1, 2020 via email

egil commented Feb 2, 2020

jpiell commented Feb 2, 2020 via email

egil commented Feb 3, 2020

jpiell commented Feb 3, 2020 via email

jpiell commented Feb 4, 2020 •

edited by egil

Loading

egil commented Feb 4, 2020 •

edited

Loading

jpiell commented Feb 4, 2020 via email

egil commented Feb 4, 2020

jpiell commented Feb 5, 2020 •

edited by egil

Loading

egil commented Feb 5, 2020

jpiell commented Feb 5, 2020

egil commented Feb 5, 2020

jpiell commented Feb 5, 2020 via email

egil commented Feb 6, 2020

egil commented Feb 6, 2020

egil commented Feb 11, 2020

andrewmorris-dev commented Sep 17, 2020 •

edited

Loading

egil commented Sep 17, 2020

Question on Handling ValidSubmit in ChildContent, #50

Question on Handling ValidSubmit in ChildContent, #50

Comments

jpiell commented Jan 31, 2020

egil commented Feb 1, 2020

jpiell commented Feb 1, 2020 via email

egil commented Feb 1, 2020

jpiell commented Feb 1, 2020 via email

egil commented Feb 2, 2020

jpiell commented Feb 2, 2020 via email

egil commented Feb 3, 2020

jpiell commented Feb 3, 2020 via email

jpiell commented Feb 4, 2020 • edited by egil Loading

egil commented Feb 4, 2020 • edited Loading

jpiell commented Feb 4, 2020 via email

egil commented Feb 4, 2020

jpiell commented Feb 5, 2020 • edited by egil Loading

egil commented Feb 5, 2020

jpiell commented Feb 5, 2020

egil commented Feb 5, 2020

jpiell commented Feb 5, 2020 via email

egil commented Feb 6, 2020

egil commented Feb 6, 2020

egil commented Feb 11, 2020

andrewmorris-dev commented Sep 17, 2020 • edited Loading

egil commented Sep 17, 2020

jpiell commented Feb 4, 2020 •

edited by egil

Loading

egil commented Feb 4, 2020 •

edited

Loading

jpiell commented Feb 5, 2020 •

edited by egil

Loading

andrewmorris-dev commented Sep 17, 2020 •

edited

Loading