0

Why doesn't this work? innerHTML cannot take in something so complicated?

<html>
<head>
    <script type="text/javascript">
        function addTable() {
            var html = "<table><tr><td><label for="name">Name:</label></td><td><input type="text" id="name"></input></td></tr>"; +
                "<tr><td><label for="remarks">Remarks:</label></td><td><input type="text" id="remarks"></input></td></tr></table>";
            document.getElementById("addtable").innerHTML = html;
        }
    </script>


</head>
<body>
    <input type="submit" value="New Table" onClick="addTable()"/>
    <div id="addtable"></div>
</body>
</html>

Something less complicated like this works: 

var html = "<table><tr><td>123</td><td>456</td></tr></table>";
Improve this question

6 Answers 6

Reset to default
4

You need to either escape double quotes within the string you're assigning to the html variable, or just enclose the string with single quotes. Use a text editor with syntax highlighting and errors like that will jump out at you right away. You also have an extra semicolon in your assignment.

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

That's the main reason why I use single quotes to signify strings in javascript.
0

Your quoting is broken. You are using double quotes inside the string:

"<tr><td><label for="remarks">Remarks:</label></td><td><input ....

the Firefox error console should always be your first stop, errors like that are always logged there.

Improve this answer

Comments

0

instead of double quotes use single quotes as shown below:

var html = "<table><tr><td><label for='name'>Name:</label></td><td><input type='text' id='name'></input></td></tr>' + "<tr><td><label for='remarks'>Remarks:</label></td><td><input type='text' id='remarks'></input></td></tr></table>";

Enjoy coding!!

Improve this answer

Comments

0

Your string is delimited using double quotes and also uses them within the string. Switch to using single quotes within the string.

var html = "<table><tr><td><label for='name'>Name:</label></td><td><input type='text' id='name'></input></td></tr>"; +
"<tr><td><label for='remarks'>Remarks:</label></td><td><input type='text' id='remarks'></input></td></tr></table>";
Improve this answer

Comments

0

You need to either escape double quotes or use single quotes within the string destined for that innerHTML.

Improve this answer

Comments

0

There is an error in your string , try this :

var html = "Name:"; + "Remarks:"; document.getElementById("addtable").innerHTML = html;

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.