W3C shows html markup in javascript as an error

Question

Getting an error in W3C validator. I append a html statement using query. However, I get this error in W3C:

character "'" is not allowed in the value of attribute "id"
$('<tr id="condition' + num + '" class="clonedInput" ><td class="first-colu…
It is possible that you violated the naming convention for this attribute. For example, id and name attributes must begin with a letter, not a digit.

My code is as follows

    $('<tr id="condition' + num + '" class="clonedInput" ><td class="first-column">&nbsp;</td>
<td><span style="float:left; padding-right: 10px;"><select id="conCol' + num + '" 
name="conCol' + num + '" class="standard_select" style="width:147px; background:#fff;">
<option>Telephone Number</option><option>Mobile Number</option><option>Fax Number</option>
<option>iPhone Number</option><option>BB Messenger Id</option><option>Skype Name</option>
<option>Google Talk Id</option><option>MSN Messenger Id</option></select></td>
</tr>').appendTo('#addContact');

What is your doctype? If it's xhtml, your script code probably has to be in a CDATA section. — Pointy
– Pointy, Commented Jun 29, 2012 at 13:24
Can you post the HTML that results from this nest of jQuery? I assume your issue is that the W3C validator is giving you an error on the resulting HTML, not the javascript itself, as the W3C validator isn't meant to validate javascript statements. — jackwanders
– jackwanders, Commented Jun 29, 2012 at 13:25
@jackwanders well if it prints out that line of JavaScript, it looks to me as if the validator is indeed looking at the script source directly. — Pointy
– Pointy, Commented Jun 29, 2012 at 13:26
in that case, i would ignore the error or refactor the javascript to make better use of jQuery. The validator thinks there is a <tr> element, and that its id is set to condition' + num + '. — jackwanders
– jackwanders, Commented Jun 29, 2012 at 13:28

Bob Davies · Accepted Answer · 2012-06-29 14:59:40Z

2

Place your javascript code in an external file (not inline or in head script block), or include in a CDATA block:

<script type="text/javascript">
<![CDATA[
function addRow()
{
    //do stuff
    $('<tr id="condition' + num + '" class="clonedInput" ><td class="first-colu…
}
]]>
</script>

edited Jun 29, 2012 at 14:59

answered Jun 29, 2012 at 13:28

Bob Davies

2,2821 gold badge19 silver badges28 bronze badges

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

Comments

jackwanders · Accepted Answer · 2012-06-29 13:36:47Z

1

The W3C validator is only meant to validate your final X/HTML markup. It appears that you are pasting your source code into the validator, which includes javascript statements.

The validator is failing because it doesn't execute javascript, it just assumes your entire document is markup and sees a tr element with an id of condition' + num + ', which indeed would be an error, if it was straight HTML.

EDIT

I would refer to @BobDavies answer for how to rectify your issue; In retrospect, I've only explained why you're getting the error.

edited Jun 29, 2012 at 13:36

answered Jun 29, 2012 at 13:30

jackwanders

16.1k3 gold badges42 silver badges40 bronze badges

Collectives™ on Stack Overflow

W3C shows html markup in javascript as an error

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related