Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

  • Bhavik Spinx 1 post 71 karma points
    Jul 21, 2017 @ 09:20
    Bhavik Spinx

    How to create Custom contact us form in MVC using umbraco 7.6.4

    I wan to create custom contact us form in Umbraco MVC without using of inbuilt forms.

    In which I can have my custom fields like Name, Company Name,email, phone, message, captcha Using Umbraco MVC.

    Customers fill contact us form from site, they will get email and along with Administrator get inquiry in email as well those customer details will automatically add in Umbraco admin Content.

    I have searched in forum, but I could find solution. Kindly guide.

  • Tobias Klika 101 posts 570 karma points c-trib
    Jul 21, 2017 @ 09:58
    Tobias Klika

    If you don't want to use Umbraco.Forms you will have to do most things yourself. This includes creating the HTML for the form, posting it to the controller, validating it (where ASP.NET MVC can help) and sending the mails (additionally save to the database).

    Let's start from the beginning:

    1. You need a Controller which extends Umbraco.Web.Mvc.SurfaceController.
    2. Implement a Get method which returns the HTML form, and a Post method which processes the form.
    3. Create the cshtml view. Use common Html Helpers which allow you to create fields, labels and validation output (e.g. @Html.LabelFor, @Html.TextBoxFor, ....)
    4. Encapsulate your fields in a
      tag. You can render it with the Umbraco helper @Html.BeginUmbracoForm
    5. Create a POCO, which contains all the data you want to process in the form. You need to use this POCO in the form for default values and in the Post method as a parameter.
    6. Use Validation Attributes in your POCO so the validation works. In your Post method call ModelState.IsValid so you know if the data is valid. If not, return the view with your POCO/model, which automatically renders errors if you used @Html.ValidationSummary or @Html.ValidationMessageFor.
    7. If the form is valid, send a mail with your favorite SMTP helper (e.g. the built-in from ASP.NET)
    8. If you want to save new content when data is valid, you first need to create a document type for it (with matching attributes as your POCO). Then you can just store your data with the built-in Umbraco ContentService: Services.ContentService.Save(...) See this documentation on how to create new content.

    Basically you are just creating an ASP.NET form with a few Umbraco additions. For example you do use the SurfaceController, so you get access to the Umbraco services like ContentService.

    If you need a detailed tutorial just search for a step-by-step tut for ASP.NET MVC forms.

Please Sign in or register to post replies

Write your reply to: