I have 4 buttons on my page that load different partial view via ajax in asp.net mvc. My buttons look like this

<button class="btn btn-thinkware btn-responsive aca-button" data-url='@Url.Action("Dashboard","Benefits")'>
<i class="fa fa-users fa-fw"></i> Dashboard</button>
<button class="btn btn-thinkware aca-button" data-url='@Url.Action("HoursDetail","Benefits")'>
<i class="fa fa-clock-o fa-fw"></i> Hours Detail</button>

and my ajax looks like this.

$('.aca-button').on("click", function (evt) {
        evt.preventDefault();
        evt.stopPropagation();

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

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

I've tried using $('#partialDiv').html("") but that didn't unload on click. Basically everytime I click a the different button I have to unload the div and reload the new partial.

Related posts

Recent Viewed