Not redirecting after form submit

I have a page that is submitting to the database fine, but no matter what i do i cannot get the redirect
Tried removing and reinstalling browser component
Tried to attach a ‘success’ message redirect
Tried to attach a ‘submit’ redirect
Nothing works

any suggestions?

UPDATE - found the issue. The script for the browser was not installed when i added the component.
so for anyone that might have the same issue i have, after you install the Browser component, ensure that the script is in the code

That is an easy step to overlook. Experiences list this will help to keep that step fresh. I made the same many times when I first started using Wappler. Just go ahead and make it one of the essentials during your page setup.

Here’s some other good things you can do with the browser component from TomD: Browser Component Features

Wappler Version: 3.5.5
Operating System: Mac Big Sur
Server: PHP
Hosting: Local Docker

I have actually ran into this issue myself and I am quite baffled :frowning:

The server action works when opened in the browser, so I do not think it is a server connect issue.

My login page is quite basic but it does use Redirect to intended URL after login with a default to the dashboard page.

The issue is the form is not redirecting on success as intended.

Here is the page code:

<!doctype html>

    <meta name="ac:route" content="/login">
    <base href="/pages/">
    <script src="/dmxAppConnect/dmxAppConnect.js"></script>
    <meta charset="UTF-8">
    <title>Untitled Document</title>
    <script src="/js/jquery-3.4.1.slim.min.js"></script>
    <script src="" integrity="sha256-CutOzxCRucUsn6C6TcEYsauvvYilEniTXldPa6/wu0k=" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous" />
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="/bootstrap/4/css/bootstrap.min.css" />
    <script src="/dmxAppConnect/dmxFormatter/dmxFormatter.js" defer=""></script>
    <script src="/dmxAppConnect/dmxBrowser/dmxBrowser.js" defer=""></script>

<body is="dmx-app" id="login">
    <div is="dmx-browser" id="br"></div>
    <form is="dmx-serverconnect-form" id="scf_login" method="post" action="../dmxConnect/api/login/facebook.php" dmx-generator="bootstrap4" dmx-form-type="horizontal" dmx-on:success="br.goto(query.r.default('dashboard'))">
        <button id="btn1" class="btn btn-primary btn-lg" type="submit"><i class="fa fa-facebook"></i>&nbsp; Login with Facebook</button>

    <script src="/bootstrap/4/js/popper.min.js"></script>
    <script src="/bootstrap/4/js/bootstrap.min.js"></script>


Things I looked at:

  1. Server connect works in browser
  2. Project settings > Links Relative To = Site Root
  3. Routing setup correctly for /login and /dashboard
  4. Button in form is set to submit
  5. Browser component is in the < head > tag

Any ideas as to why the page might not redirect on successful completion of the server connect?

Do you see any errors in the browser console?
Also what does query.r expression return?

Morning @Teodor! or actually afternoon for you, LOL

Here is the screenshot of the errors in the Console.

The query.r. expression is filled in from the Security Provider Enforcer if the user has been redirected from a specific page as discussed in Redirect to intended URL after login. If the user has not visited a page prior to coming to the login page, then the default should be the dashboard page.

So is it working if the query param returns a value? Or is it not working in both cases - with/without value?

It’s not working in either case with a value or without a value.

I actually removed the query expression entirely and just did a direct browser redirect to the dashboard.php file and still got the same error, so I am not sure it has to do with the query expression.

But is your server action actually returning a success code? What does it do?

The server action is just a basic Facebook login server action that returns what it should.

Here is the output.

And the server action.

So if your server action runs fine, then when exactly do you see this facebook error?

When I click on the button. The error does not appear until then.

Can you please send a link to your page, so we can check this … probably that’s the issue. And probably the server action doesn’t return an OK 200 status so that’s why the redirect (success event) is not triggered.

Oh wait, i see an issue on your page.
Why are you using a form to run the server action? The Facebook login tutorial explains you should use an anchor link <a> to run it…

I used a form because of the browser component. I tried to do it with an anchor link, but couldn’t utilize the browser component.

Unless I was missing something there…which is entirely possible.

You can’t call the facebook login like that. It must be triggered using an anchor <a>.

Ok, I can do that easily enough.

I know with nodejs you can do server redirects, but you can’t do that in php, so how would you do a redirect using an anchor link and the Facebook login process?

Isn’t that what you are looking for: Using OAuth2 Connector with Facebook

I was under the impression that only worked for nodejs, but if works for php too, then that’s great!

The only issue is the query expression isn’t be sent to the server because I would be using the anchor link, so the server would not know where to send the user back to the page they were on after they logged in.

From a user point of view, if they try to access a restricted page that requires a login, they would expect to be sent back to the page they were on after they logged in, instead of having to navigate back to the page themselves.

I had the same issue, Nodejs redirect to intended URL after login, when I was experimenting with nodejs and that’s one of the reasons I came back to php because I thought it would be different. I could have sworn I had this working on a different project, but perhaps I ended up discarding the Facebook OAuth route and used a traditional login route instead to avoid this issue.

Thanks for taking the time to look at this @Teodor, I appreciate it. :slight_smile: