Copied to clipboard

Flag this post as spam?

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


  • Kieron 152 posts 390 karma points
    Sep 05, 2019 @ 12:41
    Kieron
    0

    Showing different partials containing forms via surface controller, upon completion of each form, show next form partial

    Is this something that would be possible?

    I'm looking to present the user with a form, and upon completion of this form, in my controller im trying to then swap the first form out, with a new form, and repeat this process X times.

    Reason being I have X number of separate forms, but they are to be filled in all in one go, I just thought it would be nice if I could swap them out without reloading the page.

    Does anyone have any advice for this or a method for showing/hiding/injecting/deleting those partials on success in my controller?

    Thanks!

  • rboogaerts 11 posts 132 karma points
    Sep 05, 2019 @ 13:20
    rboogaerts
    1

    Yes this is possible. I did something similar. I used ajax calls to a SurfaceController. My controller looks like this.

    namespace ProjectName.Controllers
    {
        public class AgendaController : Umbraco.Web.Mvc.SurfaceController
        {
    
            // GET: Events
            [HttpGet]
            [OutputCache(Duration = 3600, VaryByParam = "month;year")]
            public ActionResult GetEvents(string month, string year)
            {
                // do your magic here
                return PartialView("AgendaPartial", toReturn);
            }
        }
    }
    

    My javascript looks like this:

    function agendaAjaxRequest(date) {
        let toReturn = "";
    
        $.ajax({
            url: "/umbraco/surface/agenda/getevents",
            type: "get",
            data: {
                month: (date.getMonth() + 1),
                year: date.getFullYear()
            },
            async: false,
            success: function (result) {
                toReturn = result;
            }
        });
    
        return toReturn;
    }
    

    You can do your own magic in the controller with the form data, return a new form and change it using javascript/jQuery.

    Hope this example helps!

  • Louis Jackson-Rees 107 posts 343 karma points c-trib
    Sep 05, 2019 @ 13:25
    Louis Jackson-Rees
    0

    Just an fyi Kieron, the returned value is html, so you can just update the html of the div that contains the currently viewed form, with the new html (make sure to store your form data somewhere though e.g. in session, local storage, cookie etc)

Please Sign in or register to post replies

Write your reply to:

Draft