Routing problems with external admin template for bootstrap 5

Wappler General How To
#1

Wappler Version : 4.5.0
Operating System : Windows 11
Server Model: PHP
Database Type:
Hosting Type: Apache

File routes.json have this info:

{
  "routes": [
    {
      "path": "/",
      "url": "/app/vistas/admin/contenedor.php",
      "name": "admin-dashboard",
      "routes": [
        {
          "type": "page",
          "path": "/admin/dashboard",
          "id": "dashboard",
          "url": "_dashboard.php"
        },
        {
          "type": "page",
          "path": "/modificar-usuarios",
          "id": "admin_modificar_usuarios",
          "url": "_adm_modificar_usuarios.php",
          "exact": "true"
        }
      ]
    }
  ]
}

But when it creates .htaccess file, save this:

## Wappler routing
RewriteEngine On
<IfModule mod_negotiation.c>
    Options -MultiViews
</IfModule>
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^/?(?:/)?$ app/vistas/admin/contenedor.php [QSA,NC,L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^/?admin/dashboard(?:/)?$ app/vistas/admin/contenedor.php [QSA,NC,L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^/?modificar-usuarios(?:/)?$ app/vistas/admin/contenedor.php [QSA,NC,L]
## End Wappler routing

I can’t get it work any routing, this occurr after delete all routing from Routing Manager because the migration to a new panel with new routes, etc, etc.
I have try to restart wappler after remove all routing, even, updating new wappler version 4.5.0.
I tought that routes.json creates the .htaccess file, but now I’m not sure due to the new created htaccess file.
Or I’m doing something wrong.
Thanks in advance.

#2

Hi,
Both files look correct to me. Can you check if you have routing enabled in your project settings?

#3

image

Yes, enabled
But I can’t get it work.

#4

Looks ok.
Are you using a local PHP server or Docker?
Maybe you don’t have the correct Apache flag set for routing, if its the local PHP server.

#5

PHP, directly on server.
But what do you mean with this:

#6

I dont remember the correct term for it… But you need to enable some module/flag on Apache server for routing to work.
Maybe @patrick can help better.

#7

This is my html:

<div class="content-body">
    <div is="dmx-route" path="/" url="_dashboard.php" id="new_dashboard"></div>
    <div is="dmx-route" path="/editar-usuarios" url="_adm_modificar_usuarios.php" id="admin_modificar_usuarios"></div>
</div>

Project setting:
image

Meta tags created automatically:
image

The auto generated .htaccess file:

image
image696Ă—205 7.61 KB

My menu link with:
href="./editar-usuarios"

The dmx-route id “new_dashboard” is default and this should be replace when clic on menu link calling route dmx-route id “admin_modificar_usuarios” that have this path="/editar-usuarios"
But when I hover mouse on menu link show up this:
https://mydomain.com/app/vistas/admin/editar-usuario
The URL contains the original path of the file, it can’t get routing.
Is like routing is not been recognize.
At this point I don’t know how to solve this.
I really appreciate you help at this moment.

#8

Please maybe @patrick or @Teodor a bit of help.

#9

That looks incorrect. There should be no dot. Did you select this from the picker?

Do you have links relative to option set correctly in project settings?
Maybe check the doc for this and retry.

#10

Is SPA, so is internal:
href="./editar-usuarios" internal

Every link with an individual file, just following the docs about this.

#11

Internal is nodejs
Dot is asp.net

You are working on PHP.

#12

Refer this: Creating Single Page Apps (SPA)

#13


I’m using Routes picker and it automatically put ./
image
image941Ă—250 14.1 KB

Ok, I see that internal check option has not effect in my case, meanwhile the problem is still there.

#14

If I change this:
href="./editar-usuarios"
With this:
href="/editar-usuarios"

After click I get redirected into https://mydomain.com/editar-usuarios
So no parcial load, it made a complete refresh with a 404 page.
New url should be https://mydomain.com/admin/tablero/editar-usuarios but I can’t ge it to work.

#15

You probably need to create a fresh project and check if that is the behaviour and report.

I have an old PHP project, and don’t see the dot for routes. So either something is wrong in latest Wappler version or something is wrong with the project you are working on.

#16

The thing is that before was working, migrating everything to new panel template with new paths and links make me to remove all the old routes and create new ones.

#17

Panel template?

#18

Sorry, I mean a new theme, new bootstrap theme

#19

That has nothing to do with PHP or routes.
I am assuming you do not use Git. While setting up theme, you must have changed something else on the pages… Causing this issue.

If you do use Git, you can revert back to the state before theme.

#20

Thanks @sid, you were right, something in page was causing the problem, but not precisily my fault. Took me too much time trying to figure it out why this.

I hope this helps to others if are planing to use external bootstrap 5 templates.
The theme that I’m using is an Admin Dashboard Template, of course bootstrap 5. Updating bootstrap oblidge me to change evething because new version 5.1.0 that differ from local wappler.
The main menu structure start like this:

<div class="horizontal-menu-wrapper">
<div class="header-navbar navbar-expand-sm navbar navbar-horizontal floating-nav navbar-dark navbar-shadow menu-border container-xxl" role="navigation" data-menu="menu-wrapper" data-menu-type="floating-nav">

And exactly this piece of code data-menu="menu-wrapper" breaks routing. I don’t know why but removing it the routing start working as spected.