Home > DeveloperSection > Beginner > Creating html controls dynamically

Creating html controls dynamically


JavaScript JavaScript 
Ratings:
1 Comment(s)
 4466  View(s)
Rate this:

Creating html controls dynamically

In this code snippet I will show you that how to create html user form dynamically.

Write down the following code snippet

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title></title>

    <script type="text/javascript">

        function createUserInterface() {

            document.write("<form id='form1'>");

            document.write("Employee Id :&nbsp;&nbsp; <input type='text' id='tt1' /> <br />");

            document.write("Employee Name :&nbsp;&nbsp; <input type='text' id='tt2' /><br />");

            document.write("Employee Age :&nbsp;&nbsp; <input type='text' id='tt3' /><br />");

            document.write("Employee City :&nbsp; <select id='selectCity'><option value='Allahabd'>Allahabd</option>");

            document.write("<option value='Lucknow'>Lucknow</option><option value='Kanpur'>Kanpur</option></select><br />");

            document.write("<input type='button' id='btnSubmit' value='Submit' />");

            document.write("</form>");

        }

       

    </script>

</head>

<body onload="createUserInterface()">

   

</body>

</html>

Save the file with .html or .htm extension and open it in browser to see the output

Creating html controls dynamically


HTML Controls

By John Smith on   5 years ago
Good Article!

Don't want to miss updates? Please click the below button!

Follow MindStick