Browser Component 'Go to' Issue On Mobile App

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

Wappler Version : 2.9.0
Operating System : windows 10

A simple link does not work in any way when tested with framework 7 or bootstrap 4.I tried to solve the problem in several ways, but I could not find a solution in any way. if you want to reproduce the problem. just create a simple mobile app and try using a router or simple link.

Example Test Page
testPage.zip (847 Bytes)

Video
browserComponentIssue.zip (1.7 MB)
If there is a my mistake, please explain because my project is on hold due to this problem.

Unless the Wappler team has done some updating to framework7 support, the browser component is not what is used for linking…I use two methods of linking in fw7.

Standard link:

<a class="link" href="path/to/somewhere">Link Text</a>

Or, you can call from static events, and other standard js like this:

router.navigate(url, options)

These examples both from https://v4.framework7.io/docs

But the standard links do not work as I have shown in the video. Please download the video and watch. This example is not working on my side …

I haven’t tried this method yet. But it is very bad that the browser component does not work.

@mebeingken Have you ever reported this problem before?

also
skip
I did not understand the reason for this error :slight_smile:

These might help…

Don’t worry about those Skip existing file messages…they are not errors.

I just finished fighting this problem 10 minutes ago. In my case, for unknown reasons, when creating paths in the router, they were written in the Wappler interface, but were not present in the file code. In other words, the file code was not changed. After I entered the routing paths in the routes.js in personally, everything worked!

this is my router.js

var routes = [

  {

    "path": "/",

    "name": "home",

    "master": false,

    "url": "./index.html"

  },

  {

    "path": "/login/",

    "name": "logins",

    "master": false,

    "url": "./login.html"

  }

]

is this wrong ?

I’m going to smash the my laptop a little later. :imp: :imp: :imp: :imp: :imp:

That’s how it works
3432

1 Like

@Mr.Rubi @mebeingken still doesnt work … :))

routesjs

I don’t remember how critical it is according to the fw7 rules, but the posted content according to the rules should be taken in the div “page” and " page-content"

I took a closer look at your video. You have the wrong routes.js is open. You have to make a path in routes.js that is located in the JS root folder, not in the one in the framework7 folder

PS Another look. Strangely. Your file path is correct. Everything should work.

Here’s how I made it work:

index.js, routes.js and app.js needs to be loaded in index.html

<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript" src="js/routes.js"></script>
<script type="text/javascript" src="js/app.js"></script>

routes.js has all your routes…mine are made automatically by wappler

{
    "path": "/settings/",
    "url": "settings.html"
  }

the routes are loaded in fw7 in app.js (I've trimmed out all the rest of mine):
var app = new Framework7({
 routes: window.routes ? window.routes : [],
});

Each content page looks like this.

Notice the head page property which points to your parent file.

The page settings. The navbar can also go within the page content and will behave differently.


On your parent page (eg. index.html) you need a view that will hold the pages. If just starting out, you just need one view and it will be the “main” view.

Using my example, an onclick event could trigger a page change. Notice I am using the path from the route.

onclick="mainView.router.navigate('/settings/');"

or via a link:

<a class="link" href="/settings/">Settings</a>

These are just the basics, there is a ton that can be done with fw7 views/routing/pages.

–Ken

2 Likes

@mebeingken and @Mr.Rubi thank you for your help … now it works !!

Things get a little complicated without this update. Because I thought the browser component worked flawlessly in mobile, desktop or web applications. I assumed that the browser component would work with “framework7” to solve the problem. This update should be done to avoid problems with other users like me.

@George is it possible to put this problem on the bug list?

1 Like

this bug :triumph:

I wrote about this above. Due to poor integration of Fw7 in Wappler, when editing a route via the Wappler interface, routes will not be added to the required file. You need to open the necessary file yourself and add the route code manually. Then everything will work.

2 Likes

@Mr.Rubi and @alsdigital please report different bugs in separate topics.

Mixing all kindle of bugs in a single topic makes it difficult for us to track and resolve.

So if you have other bug with routing, post it as separate topic and not here as this topic is just about the browser go to action.

1 Like

Sure. I always try to design themes as informative as possible for both @wapplerteam and users. Right now, I just wanted to help, because I knew what problem @alsdigital was facing.