locked
Clear user INPUT after submit (OnPost) Task RRS feed

  • Question

  • User1317317131 posted

    I have  a razor page for a contact page, once I have submitted a request the email is sent however on success I want the user input to be cleared to prevent them from sending the information several times.

    Web page

    @page
    @model ContactModel
    @{
        ViewData["Title"] = "Contact";
    
    }
    <h2>@Model.Message</h2>
    <div class="container">
        <div class=" = row">
            <div class="col-sm-6">
                <address>
                    One Microsoft Way<br />
                    Redmond, WA 98052-6399<br />
                    <abbr title="Phone">P:</abbr>
                    425.555.0100
                </address>
    
                <address>
                    <strong>Support:</strong> <a href="mailto:Support@example.com">Support@example.com</a><br />
                    <strong>Marketing:</strong> <a href="mailto:Marketing@example.com">Marketing@example.com</a>
                </address>
            </div>
            <div class="col-sm-6">
                <form method="post">
                    <table class="tblcontact">
                        <tr>
                            <td>
                                <div asp-validation-summary="All" class="text-danger"></div>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <input asp-for="ContactEmail.FirstName" id="FirstName" type="text" placeholder="First Name" />
                                <span asp-validation-for="ContactEmail.FirstName" class="text-danger"></span>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <input asp-for="ContactEmail.LastName" id="LastName" type="text" placeholder="Last Name" />
                                <span asp-validation-for="ContactEmail.LastName" class="text-danger"></span>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <input asp-for="ContactEmail.Email" id="Email" type="text" placeholder="Email" />
                                <span asp-validation-for="ContactEmail.Email" class="text-danger"></span>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <select asp-for="ContactEmail.Service" asp-items="Html.GetEnumSelectList<DigitalAcademyCorp.Models.DACServices>()"><option>Select</option></select>
                                <span asp-validation-for="ContactEmail.Service" class="text-danger"></span>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <textarea asp-for="ContactEmail.Comment" class="ctext" cols="42" row="100" placeholder="Message" required>
                                </textarea><span asp-validation-for="ContactEmail.Comment" class="text-danger"></span>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <input class="btn contact-submit" id="Submit" type="submit" value="Submit" />
                            </td>
                        </tr>
                    </table>
                </form>
            </div>
        </div>
    </div>
    @section Scripts{ 
        <partial name="_ValidationScriptsPartial" />

    Page Controller/Model

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Threading.Tasks;
    using DigitalAcademyCorp.Models;
    using DigitalAcademyCorp.Services;
    using Microsoft.AspNetCore.Mvc;
    using Microsoft.AspNetCore.Mvc.RazorPages;
    using System.ComponentModel.DataAnnotations;
    
    namespace DigitalAcademyCorp.Pages
    {
        public class ContactModel : PageModel
        {
            private readonly IEmailService _mailSender;
    
            public ContactModel(IEmailService mailSender)
            {
                _mailSender = mailSender;
            }
    
            public string Message { get; set; }
            [BindProperty]
            public ContactEmail ContactEmail { get; set; }
            [BindProperty]
            public Message EmailMessage { get; set; }
    
             public void OnGet()
            {
                Message = "We are keen to hear what you have to say.";
            }
    
            public async Task OnPost()
            {
                if(ModelState.IsValid)
                {
                    EmailMessage.From = ContactEmail.Email;
                    EmailMessage.Body = ContactBody(ContactEmail.FirstName, ContactEmail.LastName, ContactEmail.Service.ToString(), ContactEmail.Comment);
                    EmailMessage.Subject = ContactEmail.Service.ToString();
                    try
                    {
                        await _mailSender.Send(EmailMessage); //EMAIL LOW APPS ACCESS GOOGLE
                        
    
                    } catch (Exception)
                   {
                       Message = "Oops there seems to be an error sending your message";
                   }                
                }
                else
                {
                    Message = "Oops you inputs are not valid for the page";
                }
            }
            private string ContactBody(string FName,string LName,string DACService,string Comment)
            {
                string htmlbody = "<table><tr><div>Hi " + FName + " " + LName + "</div> </tr> <tr><div><br><p>Thank you for contacting Example <strong>E</strong>. We are pleased that you are interested in our <strong>" + DACService + "</strong> offering. <br><br> We will be responding to your message below shortly <br><br><em>" + Comment + "</em><br></p> </div> </tr> <tr> <div><br> <p>Thank you <br> <br> <strong>Example</strong> </p> </div> </tr></table>";
    
                return htmlbody;
            }
        }
    }

    Please help

    Thank you,

    Sunday, June 7, 2020 1:43 PM

Answers

  • User475983607 posted

    Either redirect to a confirmation page or set the model properties to empty values.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Sunday, June 7, 2020 2:50 PM
  • User-474980206 posted

    You have two options. In the OnPost method, after processing model data

    1. Clear the model properties
    2. Redirect to the same page. (post, redirect, get pattern)
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Sunday, June 7, 2020 2:56 PM

All replies

  • User475983607 posted

    Either redirect to a confirmation page or set the model properties to empty values.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Sunday, June 7, 2020 2:50 PM
  • User-474980206 posted

    You have two options. In the OnPost method, after processing model data

    1. Clear the model properties
    2. Redirect to the same page. (post, redirect, get pattern)
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Sunday, June 7, 2020 2:56 PM