javascript url hyperlink autofill input-field

Javascript - Pass URL/Hyperlink parameters to fill input fields of loginpage

I would like to write a function with JavaScript to be able to fill out form fields in advance via hyperlink - passing parameters from the address line (URL parameters) to the form fields.

URL: [...]/login.aspx?firstname=My&lastname=Test

After clicking the link, both input fields of the login area should now already be prefilled with "My" and "Test".

head-part:

    <script type="text/javaScript">
function getUrlParameter(par) {
    var value = '';
    var UrlParameter = window.location.search;

    if (UrlParameter != "") {
        var i = UrlParameter.indexOf(par + "=");
        if (i >= 0) {
            i = i + par.length + 1;
            var k = UrlParameter.indexOf("&", i);
            if (k < 0) {
                k = UrlParameter.length;
            }
            value = UrlParameter.substring(i, k);
            for (i = 0; i < value.length; i++) {
                if (value.charAt(i) == '+') {
                    value = value.substring(0, i) + " " + value.substring(i + 1, value.length);
                }
            }
            value = unescape(value);
        }
    }
    else {
        document.write("error");
    }
    return value;
}

function init() {
    var firstname= getUrlParameter("firstname");
    document.Kontakt.Firstname.value = firstname;

    var lastname= getUrlParameter("lastname");
    document.Kontakt.Lastname.value = lastname;
}

body-part

<body onload="init()">

<form id="frmStartseiteMaster" name="Kontakt" runat="server" class="ym-form ym-full ym-form-login ie_display" autocomplete="off" data-alert="">

<input type="text" name="Firstname" id="Firstname" />
<input type="text" name="Lastname" id="Lastname" />

The displayed error is:

Uncaught TypeError: Cannot read property 'Firstname' of undefined

I have been sitting on this problem for a while and can't get any further. I would appreciate your help.

Best regards, Chrissy

Solution

I would try It like this:

> <html> <head> <meta charset="utf-8"> </head> <body>
> 
> <form id="frmStartseiteMaster" name="Kontakt" runat="server"
> class="ym-form ym-full ym-form-login ie_display" autocomplete="off"
> data-alert="">
> 
> <input type="text" name="Firstname" id="Firstname" /> <input
> type="text" name="Lastname" id="Lastname" />
> 
> <script type="text/javascript"> function getUrlParameter(par) {
>     var value = '';
>     var UrlParameter = window.location.search; console.log("url: " + UrlParameter);
>     if (UrlParameter != "") {
>         var i = UrlParameter.indexOf(par + "=");
>         if (i >= 0) {
>             i = i + par.length + 1;
>             var k = UrlParameter.indexOf("&", i);
>             if (k < 0) {
>                 k = UrlParameter.length;
>             }
>             value = UrlParameter.substring(i, k);
>             for (i = 0; i < value.length; i++) {
>                 if (value.charAt(i) == '+') {
>                     value = value.substring(0, i) + " " + value.substring(i + 1, value.length);
>                 }
>             }
>             value = unescape(value);
>         }
>     }
>     else {
>         document.write("error");
>     }
>     return value; }
> 
> function init() {
>     var firstname= getUrlParameter("firstname");
>     document.getElementById("frmStartseiteMaster").Firstname.value = firstname;
> 
>     var lastname= getUrlParameter("lastname");
>     document.getElementById("frmStartseiteMaster").Lastname.value = lastname; } window.onload=function() {  init(); } </script> </body>
> </html>

Have fun