N2 MVC Add-on: Ajax Subscribe Form

N2 MVC Add-on: Ajax Subscribe Form

This page describes how to use a customized subscribe form, which you can place on any existing page of your website based on N2.

The list of the add-on features includes:

  • Ajax implementation based on MicrosoftMvcAjax.js.
  • Add-on compatible with both versions of MVC 1.0 and 2.0
  • Easy installation and use.
  • Implementing validations by empty fields, incorrect email (no '@' or '.'), duplicates of an existing (already subscribed) email address.
  • All Subscribe Form fields are editable by N2CMS for each page separately.
  • Simple Css styling is already implemented, so it can be used as is.
  • Implemented storing information about newsletters under 'StartPage' of site.

This procedure will instruct how to use ajax form from this add-on.

  • First unrar to 'siteroot\addons\' folder, then create a reference to 'AjaxSubcribeFormAddon1.5.dll' or 'AjaxSubcribeFormAddon2.0.dll' according to the version of your N2 website.
  • Then, at the Global.asax.cs register the controller's assembly from this add-on: /* find such line of code - engine.RegisterControllers(typeof (HomeController).Assembly); under it add the registration of an add-on assembly */ engine.RegisterControllers(typeof (HomeController).Assembly); engine.RegisterControllers(typeof(N2.Addons.AjaxSubcribeFormAddon.Controllers.NewsletterController).Assembly); /* or for an older version (1.5, etc): */ container.RegisterControllers(typeof(HomeController).Assembly); container.RegisterControllers(typeof(N2.Addons.AjaxSubcribeFormAddon.Controllers.NewsletterController).Assembly);
  • According to the version of your N2 website check version of web.config file under '\Addons\AjaxSubcribeFormAddon\UI\'. (web1.5.config – MVC 1.0 and web2.0.config – MVC 2.0);
  • Then you only need to copy the following code and place it on your pages(parts) classes and views and customize it a little bit according to your purposes. /* add such property under LanguageRoot, AbstractContentPage, or any other... */ public class LanguageRoot : AbstractContentPage, IStructuralPage, Ilanguage … [EditableItem("NewsletterDisplay", 106)] public virtual Newsletter Newsletter { get { return (Newsletter)GetDetail("NewsletterDisplay"); } set { SetDetail("NewsletterDisplay", value); } } … <% if (Model.Newsletter != null) {%> <%Html.RenderPartial(Model.Newsletter.TemplateUrl, Model.Newsletter);%> <% } else {%> <%Html.RenderPartial("~/Addons/AjaxSubcribeFormAddon/UI/Newsletter.ascx", new N2.Addons.AjaxSubcribeFormAddon.Items.Items.Newsletter());%> <% } %>

Also, some more about saving/retrieving information about subscribed newsletters:

By default AjaxSubcribeFormAddon.Engine.EnginePersister store newsletters information as ContentItems under StartPage (see screenshot). Use add-on classes NewsletterItemList and NewsletterItem for this.

Also it's possible to implement custom newsletters saving/retrieving.

Create derived class, for example:

public class TestEngine : N2.Addons.AjaxSubcribeFormAddon.Engine { public override void CreteAndSaveNewsletterRecord (N2.Addons.AjaxSubcribeFormAddon.Models.NewsletterModel model) { //... } public override IList<string> Emails() { List<string> list = new List<string>(); //... return list; } }

 

Then somewhere on view page or other page replace AjaxSubcribeFormAddon.Engine.EnginePersister by instance of your realisation.

< % N2.Addons.AjaxSubcribeFormAddon.Engine.EnginePersister = new N2.Templates.Mvc.Classes.TestEngine(); %>

Have fun using it!