Jump to content
  • 0
TroubleShooter

Login after User Registration

Question

1 answer to this question

Recommended Posts

  • 0

Hello @TroubleShooter,

 

Yes, you can. Currently, it is only possible with JavaScript.

 

The idea is to place the Registration Form and Standalone Login Page side-by-side (or at least, in the same page).

You may hide the Login Form ( using <div style="display: none;"></div> on the Header/Footer of the DataPage || More about here...), on your Registration Page but I rather keep them visible so the users can opt to just log-in if they already have an account; or register, if they don't.

 

After registration, JavaScript will fill-out the login form, and submits it programatically, therefore logging-in the newly registered user.

 

The only requirements to this implementation are:

1.) Login DataPage and Registration Form DataPage are deployed on the same page.

2.) Both DataPages are AJAX-Enabled!

3.) Headers/Footers should have the HTML Editor disabled from the Advanced tab.

 

Without futher ado, let's do this.

1.) Open DataPage Configuration for your Registration Page:

2.) Go to 'Configure Fields Section'

2.1.) Add a Header and Footer (Disable HTML Editor from the advanced tab)

2.2.) Paste the code snippet in the Footer and modify the following information.

<script>

  document.addEventListener('BeforeFormSubmit', function() {
    var registrationDP = "[@cbAppKey]";


    var loginDP = "378fd3458dfsjhefjhqerwfdsyui3274239"; //Replace with the AppKey of your Standalone Login Scren
    var username_field = "username"; //replace with the name of your username field (CASE SENSITIVE!)
    var password_field = "password"; //replace with the name of your password field (CASE SENSITIVE!)

    
    //No modifications necessary from this point onward.
   document.querySelector(`[action*="${loginDP}"] [id*=xip_username]`).value = document.querySelector(`[action*="${registrationDP}"] [id*=InsertRecord${username_field}]`).value
   document.querySelector(`[action*="${loginDP}"] [id*=xip_password]`).value = document.querySelector(`[action*="${registrationDP}"] [id*=InsertRecord${password_field}]`).value
  
  })

</script>

 

5.) Go to 'Destination and Messaging'

5.5) Set Destination after record submit to: Display a message; Disable the HMTL Editor!

5.6) Paste the code snippet below; then modify.

Registered Successfully. 

<script>
   var loginDP = "378fd3458dfsjhefjhqerwfdsyui3274239";
   document.querySelector(`[action*="${loginDP}"]`).submit();
</script>

 

 

After saving, you should be good to go.

Working example: https://stage.caspio.com/support/forums/DefinitelyNot31337/register-login/index.html

Application Export Package: CaspioData_2019-Apr-02_0219.zip

 

Good luck and happy hacking!

 

Regards

DN31337!

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...