0

I’d like to invite some users via email to register and would like to prefill the user registration fields, such as

A.) username and B.) email.

Unfortunately it is not working and my JS skills suck... Been stuck for hours... Can someone guide me in the right direction? I’ve already tried the following…

In functions.php I’m checking if we’re on Login/Register Page

function is_wplogin(){
    $ABSPATH_MY = str_replace(array('\\','/'), DIRECTORY_SEPARATOR, ABSPATH);
    return ((in_array($ABSPATH_MY.'wp-login.php', get_included_files()) || in_array($ABSPATH_MY.'wp-register.php', get_included_files()) ) || (isset($_GLOBALS['pagenow']) && $GLOBALS['pagenow'] === 'wp-login.php') || $_SERVER['PHP_SELF']== '/wp-login.php');
}

function prefillercheck(){
 if( is_wplogin() ){
     wp_enqueue_script('prefiller', 'https://example.com/prefiller.js',);
     }
}

add_action('login_enqueue_scripts', 'is_wplogin');
add_action('login_enqueue_scripts', 'prefillercheck');

So far so good… The following (“prefiller.js” javascript) also seems to be loading on Login/Register Page. But it is not populating the fields (‘user_login’ and ‘user_email’). :/ Here's the script (prefiller.js):

<script type="text/javascript">
var getUrlParameter = function getUrlParameter(sParam) {
    var sPageURL = decodeURIComponent(window.location.search.substring(1)),
        sURLVariables = sPageURL.split('&'),
        sParameterName,
        i;
    for (i = 0; i < sURLVariables.length; i++) {
        sParameterName = sURLVariables[i].split('=');
        if (sParameterName[0] === sParam) {
            return sParameterName[1] === undefined ? true : sParameterName[1];
        }
    }
};

var VARIABLE = getUrlParameter('PARAMETER');

if (VARIABLE != null) {
     document.getElementById('INPUT-FIELD-ID').value = VARIABLE;
}

Source: Approach idea https://www.youtube.com/watch?v=2nUOQl4E9HY

Code source (js script): https://wplearninglab.com/contact-form-7-get-value-from-url/

Code source (Check is_wplogin): https://wordpress.stackexchange.com/a/237285

Since it wasn't working I tried to run the following script instead of the prefiller.js. Without luck...

<script type="text/javascript">

var query = window.location.search.substring(1);

//alert(query);

var paramList = query.split('&');

for (var i=0; i < paramList.length; i++)
{
    var param = paramList[i].split('=');

    //alert (param[0] + ' - ' + param[1]);

    //change this to name of your URL variable
    if(param[0] == 'email')
    {
        //change this to ID of target element
        var element = document.getElementById('user_email');

        if (element)
        {
            for (var j=0; j < element.options.length; j++)
            {
                //alert('option ' + j + "; " + element.options[j].text);

                if (element.options[j].text == decodeURIComponent(param[1])
                {
                    //alert(element.options[j].text);

                    element.options[j].selected = true;

                    break;
                }
            }
        }
    }
}

</script>

Source: https://github.com/prioritythinking/parse-url-parameters-javascript/blob/master/JavaScript-URL-Variables-Snippet.html

Can someone tell me what I am missing? :/

Your help is much appreciated! Thank you.

1 Answer 1

0

Give this code a try:

var query = window.location.search.substring(1);

var paramList = query.split('&');

for (var i=0; i < paramList.length; i++)
{
    var param = paramList[i].split('=');

    if(param[0] == 'email')
    {
        var element = document.getElementById('user_login');

        if (element)
        {
            element.value = decodeURIComponent(param[1]);
        }
    }
}

I used the browser inspector console to test it out quickly and debug it — there was an error in the syntax (a missing parenthesis) and user_email needed to be user_login. It's a great tool if you aren't familiar with it and can speed up the time it takes to write JS. Also, element.value was the key to changing the field.

Incidentally, you don't need this line:

add_action('login_enqueue_scripts', 'is_wplogin');

... in fact, it doesn't do anything! prefillercheck calls is_wplogin directly.

4
  • Hey Nahba, thx for looking into it and your reply! To keep it short: It doesn't work (for me). I added your script, removed the redundant action (pls don't laugh, I added it "frustrated" moment ;)) in functions.php, cleared cache but still... No luck. :( Since I'm trying to fill out the registration form the ID's on my form are: 'user_email' (for email) and 'user_login' (for username). Nevertheless neither of them gets populated. :/
    – VolkerHarz
    Sep 21, 2022 at 4:00
  • Interesting, sorry about that. Does it work if you run it in the browser console, on the login page? Sep 21, 2022 at 5:04
  • Well yea, it "works" in a sense that the window.location.search.substring throws out the parameters and I can split them. But I can't get it to work that it populates the fields.
    – VolkerHarz
    Sep 23, 2022 at 2:48
  • Are you able to share a link to the login page by any chance? Sep 23, 2022 at 2:51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.