[Solved] How to reload panel contents?


#1

In my app, “panel-left” show user information after login.
I made a request ajax for login. like this:

app.request(
              { 
                url: '/users/sign_in',
                method: 'POST',
                crossDomain: false,
                data: {
                   "user[login]": $("input#demo-username-2.focus.input-with-value").val(),
                   "user[password]": $("input#demo-password-2.input-with-value").val(),
                   "authenticity_token":AUTH_TOKEN
                },
                statusCode: {
                  404: function(xhr) {
                    console.log('page not found');
                  }
                },
                complete: function() {
                  console.log('complete');
                },
                success: function(response) {
                        app.router.navigate("/");
                },
                error: function(){
                  console.log("error");
                }
              }
            )

As you can see, I made a redirection in case success. Everything work fine except panel-left who isn’t reload with session variables.

In my browser, with developpement tools - console, I saw the redirection ‘/’ and I saw its reponse is all right.
But the panel is still keep his view init. like nobody connected!

I have tried this below: no one works.

app.router.navigate("/", {reloadCurrent:true});
app.router.navigate("/", {reloadAll:true});
app.router.navigate("/", {ignoreCache:true});

Even I change parameters in init framework7 for my app globally. like so:

var app = new Framework7({
  root: '#app',
  theme: theme,
  cache: false,
  view: {
    iosDynamicNavbar: false,
    xhrCache: false,
    stackPages:true,
    animateWithJS:true
  },
...

My solution:
I create a new separate view is dedicated to left panel in rails( a new route in rails). And then I made a request ajax for this view, in case success I made a update html $$(".panel-left")[0].innerHTML = reponse of request ajax.


#2

Do you put left panel to a separate view? So call navigate method for this view too…


#3

Thank you for your reply.
My app is build with ruby on rails. I have layout view which contents <head>, <body>, reservation block for left panel and reservation block for mainview content. The structure of my layout as below:

<head>
...
</head>
<body> 
  <div id="app"> 
              <%= yield :left_panel %>
              <div class="view view-main view-init"> 
                     <%= yield :mainview_content %>
              </div>
  </div>
</body>

When I navigate to “/” page, I saw that my layout view’s mainview content is changed by <div class="page">...</div> of “/” page. But the reservation block for left panel is not load.

To fill data in layout, I have below In my “/” view:

<% content _for :left_panel do %>
<div class="panel panel-left panel-reveal"> 
... user information
</div> //  **(# this part is not load in layout)**
<% end %>

<% content _for :mainview_content do %>
<div class="page"> ... </div>  **(# this part is load correctly)**
<% end %>