Documentation

Creating the admin page to add an edit FAQS

In order to add, edit and delete FAQs, we need to add a controller to the admin controllers folder. Add the following file in \Apps\Faqs\Areas\Admin\Controllers:

using System.Web.Mvc;
using MrCMS.Web.Apps.Faqs.Entities;
using MrCMS.Web.Apps.Faqs.Pages;
using MrCMS.Web.Apps.Faqs.Services;
using MrCMS.Website.Controllers;

namespace MrCMS.Web.Apps.Faqs.Areas.Admin.Controllers
{
    public class FaqController : MrCMSAppAdminController<FaqsApp> 
    {
        private readonly IFaqService _faqService;
        public FaqController(IFaqService faqService)
        {
            _faqService = faqService;
        }

        
        public PartialViewResult Add(ShowFaqs faqPage)
        {
            return PartialView(new Faq { ShowFaqs = faqPage });
        }

        
        
        public RedirectToRouteResult Add_POST(Faq item)
        {
            _faqService.Add(item);
            return RedirectToAction("Edit", "Webpage", new { id = item.ShowFaqs.Id });
        }

        
        public PartialViewResult Edit(Faq item)
        {
            return PartialView(item);
        }

        
        
        public RedirectToRouteResult Edit_POST(Faq item)
        {
            _faqService.Update(item);
            return RedirectToAction("Edit", "Webpage", new { id = item.ShowFaqs.Id });
        }

        
        public PartialViewResult Delete(Faq item)
        {
            return PartialView(item);
        }

        
        
        public RedirectToRouteResult Delete_POST(Faq item)
        {
            _faqService.Delete(item);
            return RedirectToAction("Edit", "Webpage", new { id = item.ShowFaqs.Id });
        }
    }
}

Next, in the views folder add a new folder called 'Faq'. In this folder we will need three files. Add, Edit and Delete. Please see the project files for their content.

Finally, we will need to add the admin page to edit the Faqs. To do this we will update the file we added originaly and add:


@using System.Linq
@using System.Web.Mvc.Html
@model MrCMS.Web.Apps.Faqs.Pages.ShowFaqs
@if (Model.Faqs.Any())
{
    <table class="table table-condensed table-striped">
        <thead>
            <tr>
                <th>Questions</th>
                <th>Actions</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var item in Model.Faqs)
            {
                <tr>
                    <td>
                        @item.Question
                        </td>
                        <td>
                            <div class="btn-group">
                                @Html.ActionLink("Edit", "Edit", "Faq", new { id = item.Id }, new { @class = "btn btn-default btn-mini", data_toggle = "fb-modal" })
                                @Html.ActionLink("Delete", "Delete", "Faq", new { id = item.Id }, new { @class = "btn btn-mini btn-danger", data_toggle = "fb-modal" })
                            </div>
                        </td>
                    </tr>
            }
        </tbody>
    </table>
}

<a href="@Url.Action("Add", "Faq", new { id = Model.Id })" class="btn btn-success" data-toggle="fb-modal">Add Item</a>

With that in place, you will now be able to add, edit and delete FAQs:

Next: Displaying the FAQs in the UI