How to refresh a page without Refreshing Master Page

replied 8 years ago

I believe I found the solution but, I loose the JS files when I go to other page. The <scripts> that I have at the Master page, I loose them when I go to other page. Why?

I add the Render Sections to controller:

public static function getCustomers(){
    // SOME CODE
    return view('client_views/showCustomers')->with('customer', $customer)->renderSections()['content'];
}

At the layout I have:

<script>
    $(".tab-content a").on('click',function(e) {
var href = $(this).attr('href');
//var menu_title = $(this).attr('menu_title');
    
$(this).parent().siblings().removeClass("active");
//console.log($(this).parent().siblings());			
if(href != undefined) {
	//$('#workspace_title').html(menu_title);
	e.preventDefault();
            //console.log($(this).attr('href'));
            $("#container-fluid").load($(this).attr('href'));
    }	
});
</script>

And in the view I removed the @extends tag and have only this:

@section('content')
    MY HTML CODE
@endsection

Last updated 8 years ago.

0

jasonrust

replied 8 years ago

Solution

Hello, jQuery - Ajax, in ajax action u can return view(), it will return compiled html and jst replace yours exists template with the incoming template. Simple example:

jQuery.ajax({
    action: '{your action}', // u can use '{{ route('route_name') }}' aswell.
    data: '{your data}', // some parameters to request send as json object incoming as array
    success: function (response) {
       console.log(response); // output of your action.
    }
});

It's is the best way to change yours content without reload. However, if you don't want to use ajax on your site, just take a look at this guide

Last updated 8 years ago.

0

apeafa

replied 8 years ago

Sorry, I was trying to use Ajax but without success :( Thats an example of a menu. When I click, how can I pass the information with Ajax?

 <ul class="nav navbar-nav side-nav">
     <li id="listLI">
                    <a href="/dashboard"><i class="fa fa-fw fa-dashboard"></i> Dashboard</a>
    </li>
    <li  id="listLI" class="tab-content">
                    <a href="/showCustomers"><i class="fa fa-fw fa-table"></i> Customers</a>
    </li>
</ul>

I am doing something like this (whithot data):

$("#listLI a").on('click',function(e) {
        var href = $(this).attr('href');
        jQuery.ajax({
                    url: href, 
                    success: function (response) {
                       $("#container-fluid").load($(this).attr(href));
                    }
                });
});

I may have misunderstood the concept of Ajax and I'sorry for that

Last updated 8 years ago.

0