2

I'm struggling to create my first SXA component for an email form. Even after looking at several tutorials and Sitecore Doc It still doesn't work.

I use Sitecore 9.2 and SXA 1.9.

For now, as I understand I need pretty much 5 things which I did:

  • Create Sitecore Templates enter image description here

  • Add a Controller


using System.Net.Mail;
using System.Web.Mvc;
using Sitecore.Configuration;
using BABA.Feature.PageContent.Repositories;
using Sitecore.XA.Foundation.RenderingVariants.Controllers;
using BABA.Feature.PageContent.Repositories;
using Sitecore.XA.Foundation.Mvc.Controllers;

namespace BABA.Feature.PageContent.Controllers
{
    public class EmailFormController : StandardController
    {
        protected readonly IEmailFormRepository _repository;

        public EmailFormController(IEmailFormRepository repository)
        {
            this._repository = repository;
        }
        protected override object GetModel()
        {
            return _repository.GetModel();
        }
               public ActionResult EmailForm()
               {
                   return View(this._repository.GetModel());
               }
        /*
              [HttpGet]
               public ActionResult Index()
               {            
                   return View();
               }

               [HttpPost]
               [ActionName("Index")]
               public ActionResult IndexPost(string from = "Default from", string to = "Default to", string subject = "Default subject", string body = "Default body")
               {

                   //SendMailAction(string to, string from, string subject, string message);
                   SendMailAction(from, to, subject, body);
                   return View();
               }
               */
        public static void SendMailAction(string from, string to, string subject, string body)
        {
            var articleName = "Test Article";
            var concatSubject = subject + articleName;
            var myMessage = new MailMessage(from, to, concatSubject, body);
            Sitecore.MainUtil.SendMail(myMessage);
        }

        public static void SendMail(MailMessage message)
        {
            string mailServer = Settings.MailServer;
            SmtpClient smtpClient;
            if (string.IsNullOrEmpty(mailServer))
            {
                smtpClient = new SmtpClient();
            }
            else
            {
                int mailServerPort = Settings.MailServerPort;
                if (mailServerPort > 0)
                {
                    smtpClient = new System.Net.Mail.SmtpClient(mailServer, mailServerPort);
                }
                else
                {
                    smtpClient = new System.Net.Mail.SmtpClient(mailServer);
                }
            }
            string mailServerUserName = Settings.MailServerUserName;
            if (mailServerUserName.Length > 0)
            {
                string mailServerPassword = Settings.MailServerPassword;
                System.Net.NetworkCredential credentials = new System.Net.NetworkCredential(mailServerUserName, mailServerPassword);
                smtpClient.Credentials = credentials;
            }
            smtpClient.Send(message);
        }
    }
}
  • Add a View

@using System.Web.Mvc;
    <div @Html.Sxa().Component("emailform", Model.Attributes)>
        <div class="component-content">
            <form method="post" action="@Url.Action("Index", "EmailForm")">
                @Model.LabelFrom.Render()
                @Html.TextBox("to", null, new { @class = "form-control", @placeholder = "exemple@mail.com" })
                <br />
                @Html.Label("De la part de")
                @Html.TextBox("from", null, new { @class = "form-control", @placeholder = "exemple@mail.com" })
                <br />
                @Html.Label("Objet")
                @Html.TextBox("subject", "Cet article pourrait vous intéresser: ", new { @class = "form-control" })
                <br />
                @Html.Label("Votre Message")
                @Html.TextArea("body", new { @class = "form-control", placeholder = "Saisissez votre message" })
                <br />
                <input type="submit" class="btn btn-primary" value="Envoyer" />
            </form>
        </div>
    </div>

  • Create a Controller Rendering
  • Add a Model
using Sitecore.XA.Foundation.Mvc.Models;
using Sitecore.XA.Foundation.Variants.Abstractions.Models;

namespace BABA.Feature.PageContent.Models
{
    public class EmailFormModel : RenderingModelBase
    {
        public string LabelFrom { get; set; }
        public string LabelTo { get; set; }
        public string LabelSubject { get; set; }
        public string LabelMessage { get; set; }
        public string SubmitButton { get; set; }
    }
}

  • Add The Repository
using System.Collections.Generic;
using BABA.Feature.PageContent.Models;
using Sitecore.Data.Items;
using Sitecore.Mvc.Presentation;
using Sitecore.XA.Foundation.Mvc.Repositories.Base;
using Sitecore.XA.Foundation.RenderingVariants.Repositories;

namespace BABA.Feature.PageContent.Repositories
{
    public class EmailFormRepository : ModelRepository, IEmailFormRepository
    {
        public override IRenderingModelBase GetModel()
        {
            EmailFormModel model = new EmailFormModel();
            FillBaseProperties(model);
            model.LabelFrom = GetFrom();
            return model;
        }
        private string GetFrom()
        {
            var contentItem = RenderingContext.Current.Rendering.Item;
            var from = contentItem["From"];
            return from;


        }
    }
    public interface IEmailFormRepository : IModelRepository
    {
    }
}

  • Register dependencies
using Microsoft.Extensions.DependencyInjection;
using BABA.Feature.PageContent.Controllers;
using BABA.Feature.PageContent.Repositories;
using Sitecore.DependencyInjection;

namespace BABA.Feature.PageContent
{
    public class RegisterDependencies : IServicesConfigurator
    {
        public void Configure(IServiceCollection serviceCollection)
        {
            serviceCollection.AddTransient<IEmailFormRepository, EmailFormRepository>();
            serviceCollection.AddTransient<EmailFormController>();
        }
    }
}
  • Add new component into SXA tool bar enter image description here

The issue here is not the mail sending functionality.I just want my view to be displayed properly.

What am I doing wrong?

Thanks in advance!

  • I've not done much with Sxa but Looking at your error on EmailForm.cshtml it looks like you are probably missing the Sxa dll with the Mvc helpers in required for the line: @Html.Sxa().Component("emailform", Model.Attributes). – Adam Seabridge Nov 4 at 15:57
  • Yes that was it thx! – Ludovic LE-CURIEUX Nov 8 at 15:43
  • No worries. Glad it was helpful – Adam Seabridge Nov 8 at 15:48
1

Try adding the following two directives to the view

  • @using Sitecore.XA.Foundation.SitecoreExtensions.Extensions
  • @using Sitecore.XA.Foundation.MarkupDecorator.Extensions

Also make sure that the SXA Dlls are referenced in your project.

  • I had to DL install Sitecore.Feature.Media package to make it work thx! – Ludovic LE-CURIEUX Nov 8 at 15:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.