London Dev Meetup Rescheduled! Due to unavoidable reasons, the event has been moved to 21st May. Speakers remain the same—any changes will be communicated. Seats are limited—register here to secure your spot!

AI OnAI Off
Loading...
Area: Optimizely CMS

Gadget development, step 2: Interacting with server

The previous step shows how to create a gadget that can show messages in the database. This step shows how to put the messages in. 

Posting messages to the controller

AJAX lets you post information from the dashboard.

C#
<%@ Import Namespace="EPiServer.Shell.Web.Mvc.Html" %>
      <div class="epi-defaultPadding">...</div>
      <hr />
       <% Html.BeginGadgetForm("Save"); %>
           <input name="text" />
           <%= Html.AcceptButton() %>
       <% Html.EndForm(); %>

The view renders a form with a text input field and a Submit button. Because the example has a gadget form, the form is serialized and posted using jQuery.ajax. The results of the Save action replace any existing content in the gadget.

Taking care of posted messages in the controller

The controller accepts the posted message and stores it in the store. The returned view takes the place of the existing view in the gadget area. The mapping of the posted message string to input parameters is a feature of ASP.NET MVC. 

C#
public ActionResult Save(string text)
          {
            // store the posted message
              Message message = new Message();
              message.Text = text;
              message.From = User.Identity.Name;
              message.Sent = DateTime.Now;
              store.Save(message);
              var messages = GetRecentMessages();
              return View("Index", messages);
                   }
                IList<Message> GetRecentMessages()
               {
          return (from m in store.Items<Message>()
             where m.Sent > DateTime.Now.AddMinutes(-1)
               orderby m.Sent
                   select m).ToList();
         }

 

Next steps

Last updated: Nov 25, 2015