'Adding object data to html form fields

Below is my simple form html where I want to add the object data to my form fields. I went through Google search and StackOverflow but all of them were talking about jquery implementation, so here is my simple form html where I want to add the object data to my form fields. Since I'm not aware of Jquery, I want to use the Java Script approach.

Below, I have a user form where I want to bind the details object to my above form fields, so for that I'm using the below java script approach. I don't know where I'm going wrong. My object data is not getting bound with my form.  So kindly help me with it. Thank you.

<!DOCTYPE html>
<html>
    <body>
        <div>
            <form>
                Name&nbsp<input id="name" type="text" name="name"><br>
                Place&nbsp<input id="place" type="text" name="place"><br>
                Age&nbsp<input id="age" type="text" name="age">  
            </form> 
        </div>
        <script>
            
            var details ={name:'Krishna',place:'India',age:26}; 
            
            document.getElementById("name").innerHTML=details.name;
            document.getElementById("place").innerHTML=details.palce;
            document.getElementById("age").innerHTML=details.age;
            
        </script>
    </body>
</html>
javascripthtml


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions