Quantcast
Channel: Developer to developer
Viewing all articles
Browse latest Browse all 9076

Refreshing page in edit mode after ajax call to controller

$
0
0

Let's say I have a property on the page:

[Display(
    Name = "Selection Box",
    GroupName = Global.GroupNames.Contact
)]
public virtual bool SelectionBox { get; set; }

An then in the view, I have this code:

@if (PageEditing.PageIsInEditMode)
{
    @Html.CheckBoxFor(modelItem => Model.CurrentPage.SelectionBox,
        new
        {
            @class = "toggle",
            @data_url = Url.Action("UpdatePage", "DefaultPage"),
        })<script>
        $(function () {
            $('.toggle').change(function () {
                var self = $(this);
                var url = self.data('url');
                var value = self.prop('checked');
                $.ajax({
                    url: url,
                    data: { selected: value },
                    type: 'POST',
                    success: function (response) {
                        alert(response);
                    }
                });
            });
        });</script>
}

Controller method is very simple:

public ViewResult UpdatePage(ProductPage currentPage, bool selected)
        {
            var currentPageEdit = _contentRepository
                .Get<ProductPage>(currentPage.ContentLink)
                .CreateWritableClone() as ProductPage;
            if (currentPageEdit != null)
            {
                currentPageEdit.SelectionBox = selected;
                _contentRepository.Save(currentPageEdit, SaveAction.Default, AccessLevel.NoAccess);
            }
            var model = CreateModel(currentPageEdit);
            return View(string.Format("~/Views/{0}/Index.cshtml", currentPage.GetOriginalType().Name), model);
        }

Basically what it does, it takes the value of the checkbox, does a AJAX call to the controller, which then updates the page property with value. And this works fine. What I'm struggling with, is how to refresh the page in preview after the succesful save in the controller. 

I have tried subscribing to contentSaved event, but it's not called. 

Essentially I'm looking for a way to either:

  1. notify the UI from the controller that update happened and it should reload
  2. notify the UI from the javascript that the update to property/page happened and it needs to refresh

In my use case, editor will be pointing to a collection (coming from external system), and it will render list of items in that collection. Then user would be able to pick which items from that collection to show or hide. I'd like to maintain the list of exclusions as a property, which I anticipate I could update via AJAX calls.

If there are better options - I'm open for those as well.


Viewing all articles
Browse latest Browse all 9076

Trending Articles