Creating a new contact form

SO I have put a contact form in categories so when nothing is present it should show the form.



This is the form :

<form method="post" action="ContactUs_Categories" novalidate="novalidate"><style>input[type="text"]{height:50px;border:none;padding:0 20px;vertical-align:middle;font-size:15px;color:#909090;font-family:'Lato',sans-serif;background:#f0f0f0}</style><div id="contact-us-tab" class="contact-page write-review"><div class="form-fields"><div class="inputs"><label for="FullName">Your name</label> <input id="fname" placeholder="Enter your name." class="contact_tab_fullname review-title valid" type="text" data-val="true" data-val-required="Enter your name" name="FullName" value="John Smith" aria-describedby="fname-error"> <span class="required">*</span> <span class="field-validation-valid" data-valmsg-for="FullName" data-valmsg-replace="true"></span></div><div class="inputs"><label for="Email">Your email</label> <input id="email" placeholder="Enter your email address." class="contact_tab_email review-title valid" type="email" data-val="true" data-val-email="Wrong email" data-val-required="Enter email" name="Email" value="[email protected]" aria-describedby="email-error" aria-invalid="false"> <span class="required">*</span> <span class="field-validation-valid" data-valmsg-for="Email" data-valmsg-replace="true"></span></div><div class="inputs"><label for="Enquiry">Enquiry</label> <textarea id="message" placeholder="Enter your enquiry." class="contact_tab_enquiry review-text input-validation-error" data-val="true" data-val-required="Enter enquiry" name="Enquiry" aria-describedby="message-error" aria-invalid="true"></textarea> <span class="required">*</span> <span class="field-validation-error" data-valmsg-for="Enquiry" data-valmsg-replace="true"><span id="message-error" class="">Enter enquiry</span></span></div></div><div class="buttons"><button type="submit" id="send-contact-us-form" name="send-email" class="button-1 contact-us-button">Submit</button></div></div><input name="__RequestVerificationToken" type="hidden" value="CfDJ8I_LW_nY7NdInmTrz2GrSwkRmEfp4p5-SoJoOgQN7m5jkVsTO4mCyeFTNMSMTXuuzzHBL-_lYjOrEmiN_f-YWn7-v-2dY71Il_kNF8_SmXnjnrB9NyKbZVnP428emXzUIhNjFPU9TSnrkswqeKoihmJxWQFg3_NVj-lXmajfceWrD4wM3J5i75W7CgI8PnHucg"></form>

And have added controller in commoncontroller.cs file.

 [HttpPost, ActionName("ContactUs_Categories")]
        [ValidateCaptcha]
        //available even when a store is closed
        [CheckAccessClosedStore(true)]
        public virtual async Task<IActionResult> ContactUsForm(ContactUsModel model, bool captchaValid)
        {
            //validate CAPTCHA
            if (_captchaSettings.Enabled && _captchaSettings.ShowOnContactUsPage && !captchaValid)
            {
                ModelState.AddModelError("", await _localizationService.GetResourceAsync("Common.WrongCaptchaMessage"));
            }

            model = await _commonModelFactory.PrepareContactUsModelAsync(model, true);

            if (ModelState.IsValid)
            {
                var subject = _commonSettings.SubjectFieldOnContactUsForm ? model.Subject : null;
                var body = _htmlFormatter.FormatText(model.Enquiry, false, true, false, false, false, false);

                await _workflowMessageService.SendContactUsMessageAsync((await _workContext.GetWorkingLanguageAsync()).Id,
                    model.Email.Trim(), model.FullName, subject, body);

                model.SuccessfullySent = true;
                model.Result = await _localizationService.GetResourceAsync("ContactUs.YourEnquiryHasBeenSent");

                //activity log
                await _customerActivityService.InsertActivityAsync("PublicStore.ContactUs",
                    await _localizationService.GetResourceAsync("ActivityLog.PublicStore.ContactUs"));

                return View(model);
            }

            return View(model);
        }

But when it submits i get page not found what am i missing here?

You probably need to do it like ContactUs and use a route
            //contact us
            endpointRouteBuilder.MapControllerRoute(name: "ContactUs",
                pattern: $"{lang}/contactus",
                defaults: new { controller = "Common", action = "ContactUs" });
See src\Presentation\Nop.Web\Infrastructure\RouteProvider.cs

or tell the Form which controller to use similar to
                <form asp-controller="News" asp-action="NewsCommentAdd" asp-route-newsitemid="@Model.Id" method="post">
See src\Presentation\Nop.Web\Views\News\NewsItem.cshtml

Ok it works but then tries to redirect to contactusc and breaks.
this is the form now :

<form  asp-controller="Common" asp-action="ContactUsC" method="post">
                <div asp-validation-summary="ModelOnly" class="message-error"></div>
                <div class="fieldset">
                    <div class="form-fields">
                        <div class="inputs">
                            <label asp-for="FullName" asp-postfix=":"></label>
                            <input asp-for="FullName" placeholder="@T("ContactUs.FullName.Hint")" class="fullname" />
                            <nop-required />
                            <span asp-validation-for="FullName"></span>
                        </div>
                        <div class="inputs">
                            <label asp-for="Email" asp-postfix=":"></label>
                            <input asp-for="Email" placeholder="@T("ContactUs.Email.Hint")" class="email" />
                            <nop-required />
                            <span asp-validation-for="Email"></span>
                        </div>
                        @if (Model.SubjectEnabled)
                        {
                            <div class="inputs">
                                <label asp-for="Subject" asp-postfix=":"></label>
                                <input asp-for="Subject" placeholder="@T("ContactUs.Subject.Hint")" class="subject" />
                                <nop-required />
                                <span asp-validation-for="Subject"></span>
                            </div>
                        }
                        <div class="inputs">
                            <label asp-for="Enquiry" asp-postfix=":"></label>
                            <textarea asp-for="Enquiry" placeholder="@T("ContactUs.Enquiry.Hint")" class="enquiry"></textarea>
                            <nop-required />
                            <span asp-validation-for="Enquiry"></span>
                        </div>
                        @if (Model.DisplayCaptcha)
                        {
                            <nop-captcha />
                        }
                    </div>
                </div>
                <div class="buttons">
                    <button type="submit" name="send-email" class="button-1 contact-us-button">@T("ContactUsC.Button")</button>
                </div>
            </form>

The controller is posted earlier above how to reach that without it navigating to some other page after passing the controller.


How to make just submit and stay on the same page.


Thank you