App Connect + Framework7 Redirecting/Routing after logout/login/success of a server action

Wappler General How To
#1

So I’ve got the routing figured out and my mobile app is switching lightning fast between pages.

I’ve tried the following without success directing to a page after success on logout:

  • Browser componant goto ‘/pagename/’ as set up in routing
  • Browser componant goto ‘pagename.html’ as per physical filename after changing the page from to content
  • Static Event with code as per FW7 api for routing to other page: router.navigate({ name: ‘login-screen’ }); My router is setup to handle this:

{
name: ‘login-screen’,
path: ‘/login-screen/’,
url: ‘./pages/login-screen.html’,
options: {
animate: true,
},
},

So at the moment I am balding pulling hair out of my head and not knowing what else to do to make it work…

#2

also tried onsuccess=“router.navigate(’ login-screen.html’)”

#3

Also created a function:

<script>
    function signout() { 
            router.navigate({ name: '/login-screen/' });
    		};   
    </script>

and used static Event on-success:

onsuccess=“signout();”

#4

did you try onsuccess="app.router.navigate('/login-screen/')"

#5

No - will quickly! Thanks. I am so despirate to get this working :sweat:

#6

@patrick It works! Appreciate! Only thing now is it ignores

class=“panel-close” with the onsuccess so I will have to look at FW7 api on how to close the panel my sign out is in using the onsuccess as well

#7

Got it!

app.panel.close()

as easy as that!

The world is now my oyster… untill I need your help again :slight_smile:

1 Like
#8

Sounds like you are further along than most of us in the mobile development side @pixlapps, what are the chances of us getting a tutorial on some of the things you have managed to get done when you get a moment. Even just some articles or docs to add to the documentation would really be a great help.

2 Likes
#9

That is in the planning @psweb I promised @George an article on my experiences building my first mobile app. The good, the bad and the ugly. Will try for tutorials but I have a dayjob and do the other coding at night and on the weekends. Maybe December will be calmer this side. What I can say is what Thomas Edison said, but I think I am on the right track now:

thomasaedison1-2x
thomasaedison1-2x.jpg1200×630 108 KB

3 Likes
#10

I will be in Johannesburg in December after a short 5 hour drive from Durban, so if you haven’t found time by then I will just have to come and interview you, mwahaha.

That Thomas Edison quote sounds like the story of my life, to be honest.

1 Like
#11

@psweb I think we could arrange an interview over a beer. LEt me know when you are here. We can have the first official South African Wappler Meetup!

2 Likes
#12

Certainly will @pixlapps, if we are going to be real South African patriots though, it’s going to have to be Klippies and Coke. :slight_smile:

1 Like
#13

Hi guys, i have the same problem with the redirection after succesfully login but you lost me with
app.panel.close()
where is that to be done?

#14

If I remember correctly you need to run a function on static event and this function tells the panel to close:

app.panel.close();

#15

Hi Patrick, how do you use flow control with (app.router.navigate…)

#16

Hi Patrick, how do you achieve this with a flow like this (form1.data.userdetails[0].role == ‘admin’ ? ‘admin.html’ : ‘user.html’ )

#17

Calling native javascript from flows is coming soon

https://community.wappler.io/t/call-external-javascript-in-flow/18775/5

In your case:

<script is="dmx-flow" id="flow1" type="text/dmx-flow">
{
  runJS: { function: "navigate", args: "{{ [form1.data.userdetails[0].role == 'admin' ? 'admin.html' : 'user.html'] }}" }
}
</script>
<script>
function navigate(path) {
  app.router.navigate(path);
}
</script>
3 Likes