Duplicate entire Pages or Components within different pages - PHP

Hey guys,

Need some advise/help here in order to understand how to handle:

  • duplicating entire pages or
  • components that exist in page paste them in another page…

First of all, I would like to know if these actions are acceptable in Wappler or I should avoid doing them?

Let me explain a little about these 2 cases:

1) In some cases, the layout/structure and workaround of an existing page is similar to another that I want to create.
For example, I have a Product List Page (App-ID: productsList)


There are 2 Sections(Cards) in my page:
On the left side there are the Filters(query parameters) that define the products List content on the right side

I want to create a new page Order List (App-ID: ordersList) that will have the same layout but of course there will be differences on the filters(left side) and on the fields that are repeated on the List(right side)

Can I just duplicate the page (Site Manager->Files->select page/ right-click → Duplicate Page) and then change the App-ID?

Will the dmxAppConnect\config.js be auto-updated accordingly? All the components (dataStores, dataDetails, variables, arrays…) will be copy-pasted under the new page’s App-ID inside the dmxAppConnect\config.js?

2) If I have a component in a page, lets say a DataSore, that its schema is suitable for another page that I want to create, can I just insert a new DataStore in the new page and open the dmxAppConnect\config.js so I can copy/paste the DataStore from the original page.

Obviously this is because I am new to web apps (and forgive for asking this kind of questions)…

And just for clearing how this question came up on me:

A while ago, this specific page (App-ID: productsList), I have copied/pasted it from within my windows explorer (NOT WITHIN WAPPLER) and renamed it (and new App-ID: product_add), then opened that page in wappler and worked on it (changed elements etc…) till I finished it.
Today I opened the dmxAppConnect\config.js and searched for “productsList” and there was no result found… All the contents of “productsList” has been moved to “product_add” node.

BUT, both of these pages works fine!!
I am still working on LOCAL, NOT REMOTE

So, I just need a confirmation…

  • 1) Can I duplicate pages
  • 2) Can I copy/paste components inside dmxAppConnect\config.js

I hope I haven’t make you tired with this post…

Yes. Most of my new pages are created by duplicating existing pages - either from the same project or an old one.

Yes. I wouldn’t usually change the App ID when duplicating pages, so I wouldn’t usually need to edit the config.js file - but you certainly can if you need to.

(Unfortunately, I haven’t done much work with Wappler for a while, so I’m not up to date with recent developments, but as far as I know, nothing’s changed in this respect.)

1 Like

Thanks Tom for replying!

So, I duplicated that page (for example “old_page”) from within windows explorer (NOT from Wappler)…
This page contained (among others) DataStores and QueryManager before the duplication and were listed normally under the node “old_page” in my config.js.

Now, New page =“new_page”.

After the duplication, when I opened the config.js there was no node “old_page” but only “new_page” and all the components (DataStores, QueryManager etc) where under this “new_page” node of config.js…

I thought that I lost the components from the “old_page” but then I ran (LOCALY) my “old_page” and was running normally like the components were there…

That’s why I am asking about config.js… When I upload the files on remote server will that be a problem?

Maybe its a retarded question but please help me here with that one… :wink:

If you duplicate a page, either from Windows Explorer or from within Wappler, I wouldn’t expect any changes to be made to the config.js file. I don’t understand why you’re seeing these changes. I don’t think you would want any changes to appear.

Again, I’m not sure what the issue is. I don’t think config.js is needed on the server anyway. It just stores the variables, data bindings etc. for use in Wappler (AFAIK).

1 Like

@TomD really thank for taking the time to look at my post!

But I really need a basic explanation on how the config.js is getting automatically updated when pages are duplicated…

@Teodor please your attention for 1 minute brother…

My config.js has been meshed up by duplicating pages and now I have to recreate any schemas(DataStores, QueryManager etc…) that was assigned in it for every page I have.
That’s my fault of course and I don’t mind to give a few hours to correct them.
But from now on, it would be great to have a rule/guide on how to duplicate pages and keep their components details(schema) in order to use them in my new page.

All I need is to duplicate pages, give them different AppID but keep their component details/info and not have to define them again…
(obviously I am talking about complex schemas/parameters that take some time to recreate and not easy ones)

How I work in PHP:
I create a page, appRoot=Page and give it an AppID , insert a QueryManager and a DataStore and define their params/schema. Save the page.
The config.js has been updated with the components details(schema/params) under the specific node’s “AppID

When this page is duplicated and change the new page’s App_id, what should happen inside config.js?
The new page (“AppID”) should be inserted as a new node in the congif.js and the components details should be also copied under it?
Or no?
Should I duplicate in some other way the pages that I need to be duplicated?

In my case the components of course exists in the new pages but their details (QueryManager/Params and DataStore/Schema) are lost… They are empty

Any help on this would be much appreciated

If you want to keep the data store and other schemas, don’t change the App ID, just use the same one on different pages.

Thanks for replying!!

That was very easy…
But:
If I want to modify my schema a little in one of my pages, like to change var names or add some more vars?

So, from what I understand, Wappler cannot “catch” that a page is duplicated and a new AppID is given to that in order to copy the components from the old page to the new one.
Now, when the AppID is changing all the components details (schemas, parmeters, variables, arrays etc) are automatically moving inside congif.js under the new page’s (AppID) node…

Every time that I duplicate a page and give it a new AppID, can I take care of them and recreate (copy/paste/modify them) inside the config.js that is much more easier and faster than in the UI?

Is there a problem with that?

You can’t expect when you change an app id to copy the components schemas, that’s not how it works.

OK brother, I didn’t know hoe it works, that’s why I am asking to learn.
Thank you for telling me so!

So, can I modify by hand my config.js as I told you and take care of my components details?
Is there a problem with that?

There should not be a problem with that as long as you don’t corrupt the file somehow and it becomes unusable for Wappler.

1 Like

I answered this in my first reply:

I think the best way to see how it works is by watching what happens to config.js as you make changes - eg you could have the file open in a text editor. As you add components and variables etc, you’ll see how the changes are made - under the App ID defined for the current page (which might be the only one defined for the project - but not necessarily). I think it will make sense then. Also, if you duplicate a page, you’ll see that no changes will be made to config.js.

1 Like