Pass variable from JS code inside html , to a separated JS code , doesn't work

Question

first.html

<!DOCTYPE html>
<html>

</head>

<body>
            <form>
                <script type="text/javascript">

                    // grab the id number
                    var theIdNumber = localStorage.getItem("idNumber");

                    // set the ID in the HTML page
                    document.getElementById("userId").value = theIdNumber;
                </script>

                <button type="button" onClick="validateUsernamePassword()">SEND</button>
            </form> 
</body>
</html>

other.js

function validateUsernamePassword()
{    
            var idNum = $("#userId").val(); 
            alert('Well the id is :' + idNum);

            // more code 
}

The alert doesn't print the passed ID ... why ?

Because there is no element with the ID "userId" anywhere in your html document. — Jamie Dixon
– Jamie Dixon, Commented Feb 9, 2014 at 8:32
@ Amit Joki: Aha , then I can't just declare an element userId in the JS code... got it . How can I fix it ? — JAN
– JAN, Commented Feb 9, 2014 at 8:35
You already have the userid stored in local storage. Why not just pull it back out in your validateUsernamePassword method? — Jamie Dixon
– Jamie Dixon, Commented Feb 9, 2014 at 8:37

Amit Joki · Accepted Answer · 2014-02-09 08:42:03Z

Modify your html like this:

<html>
<head>
<title></title>
</head>
        <body>
                    <form>


                        <button type="button" onClick="validateUsernamePassword()">SEND</button>
                        <input type="hidden" id="userId"></input>
                    </form> 
                        <script type="text/javascript">

                            // grab the id number
                            var theIdNumber = localStorage.getItem("idNumber");

                            // set the ID in the HTML page
                            document.getElementById("userId").value = theIdNumber;
                        </script>
        </body>

    </html>

Or you could do just this:

function validateUsernamePassword()
{    
            var idNum = localStorage.getItem("idNumber"); 
            alert('Well the id is :' + idNum);

            // more code 
}

The second one is good since you already have the item in localstorage, so ther is no need of assign its value to another element

scripter · Accepted Answer · 2014-02-09 09:16:35Z

0

this trick may help you:

<html>
<head>

</head>
<body>
<dl>
<script>
    window.var1 = "hello, world";

</script>
<input type="button" value="click" onclick="clicked()">

<script>
    function clicked(){
        alert(window.var1);
    };

</script>
</body>

answered Feb 9, 2014 at 9:16

scripter

1288 bronze badges

Collectives™ on Stack Overflow

Pass variable from JS code inside html , to a separated JS code , doesn't work

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related