Copied to clipboard

Flag this post as spam?

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


  • Frank Reinhold 3 posts 73 karma points
    Jun 30, 2016 @ 14:57
    Frank Reinhold
    0

    Load Partial View by AJAX

    Hi @All,

    I'm very new to Umbraco, C# and MVC and need a little bit help.

    I have a Partial View in my master.cshtml returning some database content. Everything works, but i want to speed it up. So I thought, I have to load by jquery/ajax after loading all the other stuff. This works for "normal" views (for those with an real URL).

    Can anyone tell me how to load a Partial View "Async"? I don't need code, just the right direction :)

    Thanks! Frank

  • Alex Skrypnyk 6182 posts 24283 karma points MVP 8x admin c-trib
    Jun 30, 2016 @ 16:49
    Alex Skrypnyk
    0

    Hi Frank,

    The easiest way to fix performance is to use CachedPartial helper. It's really easy to use and great performance results.

    Look here - https://our.umbraco.org/documentation/reference/templating/mvc/partial-views

    Ajax is good - but it's perfect I think. The best way is to fix serverside.

    Cheers,

    Alex

  • Frank Reinhold 3 posts 73 karma points
    Jul 01, 2016 @ 09:50
    Frank Reinhold
    0

    Hi Alex,

    thanks for you reply. Nevertheless the page must be loaded once for the first time. Caching seems to be a good idea for views that must be loaded recurrently.

    I want to load my Masterpage, with all the content, but in the little box, where the partial view is building, I want to show the user a simple tag with a text content "is loading..." and change this content after the page is ready loaded.

  • Jinesh Kaneriya 22 posts 155 karma points
    Jul 01, 2016 @ 10:44
    Jinesh Kaneriya
    0

    Hi,

    make a <div id="visitData" onload="javascript:GetVisits()"> Content is loading </div>and close it where you want to add partial view and call controller method

    <script type="text/javascript">
        function GetVisits(e) {
        var ip = $(e).parents("tr").children("td").eq(1).text();
        var visitDate = $(e).parents("tr").children("td").eq(0).text();
        $.get("/umbraco/surface/SiteVisitors/getVisits", {
            id: ip,
            visitDate: visitDate
        }, function (data) {
              $('#visitData').empty();
              $('#visitData').html(data);
        });
    }
    

    and in controller write something like

     public class SiteVisitorsController : SurfaceController
    {
        // GET: SiteVisitors
        [HttpGet]
        public ActionResult getVisits(string id, string visitDate)
        {
            var model = Visitor.GetSiteVisitorPageByIPAddress(id, visitDate);
            return PartialView("Partials/_SiteVisitors", model);           
        }
    }
    
  • Frank Reinhold 3 posts 73 karma points
    Jul 01, 2016 @ 12:31
    Frank Reinhold
    0

    Hi,

    this is the solution! Thanks a lot! My Code was very similar but I didn't know the correct URL:

    $.get("/umbraco/surface/SiteVisitors/getVisits", {
    

    This was the magic row .... I forgot umbraco/surface

    Greetings Frank

  • Alex Skrypnyk 6182 posts 24283 karma points MVP 8x admin c-trib
    Jul 01, 2016 @ 12:32
    Alex Skrypnyk
    0

    Great Frank, I'm glad that you solved the problem.

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies