When switching layout on a content page (NodeJS) - layout doesn't update

======== TEMPLATE BUG FORM ========

Wappler Version : 3.0.1
Operating System : Mac
NODEJS

Expected behavior

The layout should change on the content page when switched.

Actual behavior

Nothing. The code is correctly changed on the content page itself, but when you load either locally on remotely (after updating changes) - the old layout remains.

How to reproduce

Create a layout page
Create a content page and assign the layout page when creating content page
change layout on the content page
Publish then view

UPDATE:
I was able to resolve this by reviewing routing, the layout change applied at a content page level was not applying to the routing layout parameter. Changing this swapped out the layout. So I still believe this is a bug, but I was able to resolve myself.

Sorry that’s not really clear.
Please show some screenshots showing what and where was not changed and what did you need to change exactly.
Also what exactly did you change on the layout page?

Sure I can try and elaborate.

I already have ‘Layout 1’
I then created a number of ‘Content’ pages and selected ‘Layout 1’ as the layout for these.
I then created a new layout ‘Layout 2’.
I then went to each content page and clicked on the ‘app’ icon and changed the page layout there. I also changed the page layout by going to the project folder and clicking the edit icon on the content page and then change the layout.

What then happens is if you view the code on the content page, it has now correctly changed the layout include in the code at the top.

Now I expect to view the page in a browser either local or remote and to see that the layout has changed.

Unfortunately this does not happen, even with the correct code on the content page, the layout page remains as ‘Layout 1’.

To rectify this I went to ‘Routing’ and instead changed the layout in the ‘Route Properties’ section. This made it work.

I’m not sure if you would consider that a ‘bug’ but if you change it on the content page, or in project folder - the code does change on the content page, so you would expect this to then work - but it doesn’t without then changing the layout on the routing property too.

What do you mean by this? And what exactly do you change on the layout page?

I asked you to show a few screenshots of what you are doing exactly, as the terms you are using are not quite clear.

Please just post a screenshot of what you change on the layout page, then what do you think has not been properly changed on the content page and another one of what exactly do you edit in “routing”.

1 Like

Teodor, I’m using Wappler specific terminology - in your menu panel you have the ‘Routing’ link, and on the bottom left hand side you have the ‘Route Properties’ section - I really don’t understand why that’s not clear, this is your terminology and kind of feel silly taking a screenshot of your own menu panel to show you.

Never the less:

Here is the routing properties:
Screen Shot 2020-07-30 at 9.48.06 am

The only way the content page will change it’s layout correctly is if I change the layout here.

If I change it on the content page itself (go to content page, click app connect, change layout) it changes the code in the page - but it does not display the layout page.

So what do you need to change exactly? That’s what I am asking - where and what was selected and what you had to change it to??

I’m using NodeJS and the templating.

So I have ‘layouts’ in the layouts folder, that might hold a specific nav menu, for example.
Then I have content pages. Depending on the purpose of the content page, I choose a specific layout.

This is all above, I’ve chosen a layout with a content page, I then went to change the layout on that content page by clickign on the app connect and changing it there, e.g.:

Screen Shot 2020-07-30 at 10.18.17 am

It appears to ‘work’ - it even changes the code on the page to the correct ‘new’ layout, but when you open in a browser, it doesn’t work unless you change the layout in the route properties.

Unless you change it from what to what? That’s what I am trying to understand…

One layout to another layout on the content page!

‘Content Page 1’ has ‘Layout 1’
I want to change ‘Content Page 1’ from ‘Layout 1’ to ‘Layout 2’

So you:

  • create a layout page and a content page from it

  • change the layout page and the content page doesn’t change?

  • then you select another layout page for your content page?

Is that what you are doing? Maybe create a short video showing the problem you are having as I am really confused by your explanation.

I’ll try again.

I create a layout page, called Layout-1
then create a content page called ‘Content-1’ and assign the layout as ‘Layout-1’

Later, I then create a new layout page, called ‘Layout-2’

I want to change the layout for the content page called ‘Content-1’

To do this, I go to the ‘Pages (/views)’ folder, and select the content page ‘Content-1’
I then click on app connect, and change the layout as in the above image to the new layout page called ‘Layout-2’

I inspect the code on the ‘Content-1’ page - the new layout page ‘Layout-2’ is applied to the code.

However, if I view in a browser - the old ‘Layout-1’ is still present on the ‘Content-1’ page when viewed in the browser.

This is only rectified, if I then go to the Wappler link ‘Routings’ click on ‘Content-1’ page view, then change the layout there.

Then it works. Simple.

Ahhh! You are selecting a whole new layout for your page.
All this time I thought you were changing the existing layout page and couldn’t see the changes made to it.

Will investigate this.
Thanks for the explanation.

1 Like

Great! Glad I got there in the end!

1 Like