CODEWITHSUNDEEP
javascriptjqueryasp.netajax
user3198994
user3198994

Reputation: 35

Exchange Information between two windows

Im not sure how to explain my problem in short at the title, so forgive me for this. Lets say I opened my website in some random page, and I have a register button. Really simple, but in my case I require the registration form to appear in other tab(or window). Not "RederPartial", nor popup window of some kind, legit new tab. The problem is, I want to be able do detect, from that random page of mine, when the registration completed (ie a new user has been created). How can I pass this information? without reloading the first page

Upvotes: 0

Views: 51

Answers (1)

Hydde87
Hydde87

Reputation: 719

There are various ways to make two windows talk with each other (through server, with cookies, using FileSystem API or Local Storage.

Locale Storage is by far the easiest way to talk between two windows who come from the same domain, but it is not supported in older browsers. Since you need to contact the server anyway to find out when someone has registered, I recommend using the server (Ajax//web sockets).

Here's a somewhat simple AJAX solution which you could use in your random page:

(function(){
    var formOpened = false;
    var registered = false;

    //Change to whatever interaction is needed to open the form
    $('#registerbutton').on('click', function(){
        if (!formOpened){
            formOpened = true;

            //Will try to poll the server every 3 seconds
            (function pollServer(){
                $.ajax({
                    url: "/ajax/pollregistered",
                    type: "GET",
                    success: function(data) {
                        if (data.registered){
                            registered = true;
                            //do other stuff here that is needed after registration
                        }
                    },
                    dataType: "json",
                    complete: setTimeout(function() {if (!registered) pollServer();}, 3000),
                    //will timeout if request takes longer than 2 seconds
                    timeout: 2000,
                })
            })();

            //opens the new tab
            var win = window.open('/registrationform', '_blank');
            win.focus();
        }
    });
})();

You can then use the session key of the visitor in the '/ajax/pollregistered' action to write your backend code to check if and when this visitor registered as user to your site.

If you don't mind using the local storage, you could poll the storage instead of the server and have the registration page write to local storage upon registration. This is less stressing for your server, but might not work for users with ancient browsers.

Also worth nothing that this method of opening a new tab is not completely reliable. Technically there is not a sure shot way of opening a new tab with javascript. It depends on browser and the preferences of the user. Opening a new tab might get blocked for users who are using anti popup plugins.

That being said, I strongly recommend revising your design and try finding a way to work with just one window instead. It's probably better for both yourself and your users.

Upvotes: 1

Related Questions