Rohit Sachdeva Rohit Sachdeva - 1 month ago 10
HTML Question

Using document.getElementsByTagName, how to get the values of the <input> tags stored in an array/Object?

I am retrieving the form elements in my Javascript, using the document.getElementsByTagName. After that, I am trying to display the content of the input tags and storing in the array or object which I am unable to.

window.onload = function (){

if (document.getElementById("submitid").addEventListener)

{
document.getElementById("submitid").addEventListener("click",function(){

alert(" I m here 1:");

var result = document.getElementsByTagName("input");

// how to retrieve the result variable here ?

for(var i=0;i<result.length;i++)

{
alert("I am here 2");

if(result[i].getAttribute("type")=="text")
{
// trying to get the values in the textbox on console, also how to retrieve and place the same in object
var result1 = result[i];
console.log(result1.innerHTML);

}
}
})

}

};


//the following is the



window.onload = function (){

if (document.getElementById("submitid").addEventListener)

{
document.getElementById("submitid").addEventListener("click",function(){

alert(" I m here 1:");

var result = document.getElementsByTagName("input");


console.log("****** Here " + result);

for(var i=0;i<result.length;i++)

{
alert("I am here 2");

if(result[i].getAttribute("type")=="text")
{
alert("i m here 3");
var result1 = result[i];
console.log(result1.innerHTML);

}
}
})

}

};

<!DOCTYPE HTML>

<html>

<head>

</head>


<body>


<form id ="signupForm">

<input type ="text" id ="textid">
<input type="text" id ="textid2">
<input type="submit" id="submitid">

</form>

<script type="text/javascript" src="demo2.js"></script>
</body>

</html>





Answer

You need to change the line console.log(result1.innerHTML); with console.log(result1.value); to get hte value of the input:

    window.onload = function (){
        
        if (document.getElementById("submitid").addEventListener)
        
            {
                document.getElementById("submitid").addEventListener("click",function(){
                    debugger;
                    alert(" I m here 1:");
                    
                    var result = document.getElementsByTagName("input");
                    
                   
                    console.log("****** Here " + result);
                    
                    for(var i=0;i<result.length;i++)
                        
                        {
                            alert("I am here 2");
                            
                            if(result[i].getAttribute("type")=="text")
                                {
                                    alert("i m here 3");
                                    var result1 = result[i];
                                    console.log(result1.value);
                                    
                                }
                        }
                })
                
            }
        
    };
<html>

<head>

</head>


<body>


  <form id="signupForm">

    <input type="text" id="textid">
    <input type="text" id="textid2">
    <input type="submit" id="submitid">

  </form>

  <script type="text/javascript" src="demo2.js"></script>
</body>

</html>

Comments