Umbraco AJAX partial view controller action call -

Question

I have the following scenario: Calendar page that loads the initial sale nodes from last 2 months. This page has a Load more button that fetches more Sale items that are 2 additional months of Sales.

I have added the call to the to controller action like this:

public ActionResult LoadMoreSales(int months = 0)
{
        if (Request.IsAjaxRequest())
        {
            if (Request.QueryString["department"] == null)
            {
                return PartialView("Calendar/_Sales", GetSales(0, months));
            }
            else
            {
                int depId = 0;
                Int32.TryParse(Request.QueryString["department"], out depId);

                return PartialView("Calendar/_Sales", GetSales(depId, months));
            }
        }
        else
        {
            return PartialView("Calendar/_Sales");
        }
}

GetSale retrieves the list of SaleViewModel and the _Sales partial is used when accessing the Calendar page and when clicking Load more button. Through this method, the AJAX call is being made and the list is being retrieved.

The _Sales partial inherits the following:

@inherits Umbraco.Web.Mvc.UmbracoViewPage<IEnumerable<SaleViewModel>>

The click button jQuery event:

$('.js-reload-details').on('click', function (evt) {
    $('div#loading').html('<img src="/images/ajax-loader.gif" />');
    evt.preventDefault();
    evt.stopPropagation();

    var $detailsDiv = $('#detailsDiv'),
        url = $(this).data('url');

    $.get(url, function (data) {
        $detailsDiv.replaceWith(data);
    });

    $('div#loading').empty();
});

And the button click is implemented like this:

<a id="loadMore" class="js-reload-details cta" data-url="@Url.Action("LoadMoreSales", "Calendar", new { months = -2})" href="javascript:;">@Umbraco.GetDictionaryValue("Calendar.LoadMore")</a>

The Sale items are being loaded, but I am unable to access UmbracoHelper and when I add macros to the list of sales page field, the call breaks since there is no UmbracoContext reference. Also, the following dictionary calls don't work:

@umbracoHelper.GetDictionaryValue("Calendar.ViewDetails")

Did anyone have the similar issue?

Related our.umbraco forum post

EDIT

I have also tried the following submit form implementation, but the result is the same:

AJAX form:

@using (Ajax.BeginForm("LoadMoreSales", 
                       "Calendar",  
                       new {months = -2}, 
                       new AjaxOption { HttpMethod = "GET", 
                                        OnSuccess = "loadMore(data, status, xhr)" }))

jQuery implementation:

function loadMore(data, status, xhr) {
        $('div#loading').html('<img src="/images/ajax-loader.gif" />');

        if (data != '') {
            $("#saleList").append(data);
        }

        $('div#loading').empty();
}

Answer 1

EDIT: Added fixed implementation.

I was able to resolve the issue by setting the CultureInfo before returning the PartialView like so: System.Threading.Thread.CurrentThread.CurrentUICulture = new CultureInfo(culture)

The action method looks like this:

public ActionResult LoadMoreSales(int months = 0, string culture = "")
{
        // Set the 'CultureInfo' to perserve 'UmbracoContext' when performing an AJAX call
        System.Threading.Thread.CurrentThread.CurrentUICulture = new CultureInfo(culture);

        if (Request.IsAjaxRequest())
        {
            if (Request.QueryString["department"] == null)
            {
                return PartialView("Calendar/_Sales", GetSales(0, months));
            }
            else
            {
                int depId = 0;
                Int32.TryParse(Request.QueryString["department"], out depId);

                return PartialView("Calendar/_Sales", GetSales(depId, months));
            }
        }
        else
        {
            return PartialView("Calendar/_Sales");
        }
}

I have added the hidden cultureInfo tag in the .cshtml:

<div id="cultureInfo" hidden>@System.Threading.Thread.CurrentThread.CurrentCulture</div>

The jQuery was also modified to read and pass the hidden value to the controllers action like so:

        var cultureInfo = $('#cultureInfo').html();

        $.get("/umbraco/surface/Calendar/LoadMoreSales?months=" + months + "&culture=" + cultureInfo, function (data) {
            if (data != '') {
                $("#saleList").append(data);
            }
            else {
                months = -1;
                $("#saleList").append('No more news to display');
            }

            _inCallback = false;
            $('div#loading').empty();
        });

There was no need to change .cshtml file, the dictionary values are being loaded correctly.

Answer 2

Marko,

This was in v6 but similar issue, so in the partial i did

var umbracoHelper = new UmbracoHelper(UmbracoContext.Current); Regards

Ismail