TheRookierLearner
TheRookierLearner

Reputation: 4173

Javascript program runs in Eclipse but not in Notepad++

I am trying to insert textboxes in a web page dynamically when I click on a button using JavaScript. I am a beginner to JavaScript. I tried executing the program in Chrome, Firefox and Opera (JavaScript is enabled). However, the program doesn't insert text boxes when I click the button. I tried to run the same code in Eclipse and the HTTP previewer in Eclipse runs the same code. Could anyone tell the reason why this is happening and how do I execute the same code in my browser?

Here is the code which I've used:

<html>
<head>
<title>Doing some random programming</title>
</head>
<body>
Add input elements here:
<br/>
<input type = "button" value = "Add another element" id = "AddButton" onClick = "AddTextBox()" />
<div id = "Division"></div>
<script type = "text/javascript">   
<!--
//var addButton = document.getElementById('AddButton');
function AddTextBox()
 {      
    var divis = document.getElementById('Division');
    var inputTxt = document.createElement("<input type = \"text\" />");
    var div = document.createElement('div');
    //input.type = "text";      
    div.appendChild(inputTxt);
    divis.appendChild(div);
}
//-->
</script>
<noscript>
    Needs javascript
</noscript>
</body>
</html>

Upvotes: 0

Views: 137

Answers (1)

Quentin
Quentin

Reputation: 944441

The createElement method takes the name of an element type, not a string of HTML.

var inputTxt = document.createElement("<input type = \"text\" />");

should be

var inputTxt = document.createElement("input");

or (if you want to explicitly state type="text", which you don't need to as it is the default):

var inputTxt = document.createElement("input");
inputTxt.setAttribute('type', 'text');

Upvotes: 2

Related Questions