CodeIgniter Forums
jQuery - Stripping self-closing tags - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Archived Discussions (https://forum.codeigniter.com/forumdisplay.php?fid=20)
+--- Forum: Archived Development & Programming (https://forum.codeigniter.com/forumdisplay.php?fid=23)
+--- Thread: jQuery - Stripping self-closing tags (/showthread.php?tid=19956)



jQuery - Stripping self-closing tags - El Forum - 06-23-2009

[eluser]Kyle Johnson[/eluser]
So I have been making some changes and cleaning up some code on an application but when I ran the xhtml validator I noticed that there are a lot of validation errors. I was quite confused!

Well after looking at it, I noticed that in my code I am putting the close tag within the variable that will be added. Notice the self-closing of the input tag.

Code:
var newTR = "<tr class='item' id='item_"+countItemList+"'>"
                        + "\n\t\t<td class='model'>" + model + "&lt;input type='hidden' name='model[]' value='" + model + "' /&gt;&lt;/td>"
                        + "\n\t\t<td class='qty'>" + qty + "&lt;input type='hidden' name='qty[]' value='" + qty + "' /&gt;&lt;/td>"
                        + "\n\t\t<td class='serial'>" + serial + "&lt;input type='hidden' name='serial[]' value='" + serial + "' /&gt;&lt;/td>"
                        + "\n\t\t<td class='asset'>" + asset + "&lt;input type='hidden' name='asset[]' value='" + asset + "' /&gt;&lt;/td>"
                        + "\n\t\t<td class='desc'>" + desc + "&lt;input type='hidden' name='desc[]' value='" + desc + "' /&gt;&lt;/td>"
                        + "\n\t\t<td class='remove'>X</td>"
                        + "\n\t</tr>";

        $('#item_list').append(newTR);

However, when I actually view the source, it does not have the self-close. The .append() method seems to strip that final tag.
Code:
<tr class="item r1" id="item_0">
        <td class="model">&lt;input name="model[]" value="" type="hidden"&gt;&lt;/td>
        <td class="qty">1&lt;input name="qty[]" value="1" type="hidden"&gt;&lt;/td>
        <td class="serial">ok&lt;input name="serial[]" value="ok" type="hidden"&gt;&lt;/td>
        <td class="asset">&lt;input name="asset[]" value="" type="hidden"&gt;&lt;/td>

        <td class="desc">&lt;input name="desc[]" value="" type="hidden"&gt;&lt;/td>
        <td class="remove">X</td>
    </tr>

How do I fix this? Any ideas?

I have tried:
//
\/
\//

They all just disappear.


jQuery - Stripping self-closing tags - El Forum - 06-23-2009

[eluser]Kyle Johnson[/eluser]
***UPDATE***

Fixed it.

Found a few interesting points regarding serving the page with the correct MIME type, as the browser determines what to parse the JavaScript as.
http://keystonewebsites.com/articles/mime_type.php

So by following the advice there, my tags are now properly closed according to the supplied standard.

So by using this in a file:
Code:
&lt;?php
$charset = "iso-8859-1";
$mime = "text/html";
function fix_code($buffer) {
return (preg_replace("!\s*/>!", ">", $buffer));
}
if(stristr($_SERVER["HTTP_ACCEPT"],"application/xhtml+xml")) {
        if(preg_match("/application\/xhtml\+xml;q=([01]|0\.\d{1,3}|1\.0)/i",$_SERVER["HTTP_ACCEPT"],$matches)) {
            $xhtml_q = $matches[1];
                if(preg_match("/text\/html;q=q=([01]|0\.\d{1,3}|1\.0)/i",$_SERVER["HTTP_ACCEPT"],$matches)) {
                    $html_q = $matches[1];
                        if((float)$xhtml_q >= (float)$html_q) {
                        $mime = "application/xhtml+xml";
            }
                }
        } else {
               $mime = "application/xhtml+xml";
                }
}
if($mime == "application/xhtml+xml") {
    $prolog_type = "&lt;?xml version=\"1.0\" encoding=\"$charset\" ?&gt;\n<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">\n&lt;html &gt;\n";
} else {
    ob_start("fix_code");
        $prolog_type = "<!DOCTYPE html PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\" \"http://www.w3.org/TR/html4/loose.dtd\">\n&lt;html lang=\"en\"&gt;\n";
}
header("Content-Type: $mime;charset=$charset");
header("Vary: Accept");
print $prolog_type;
?&gt;

And then importing it:
Code:
&lt;?php include("/path/filename.php"); ?&gt;
&lt;head&gt;
&lt;title&gt;Test page&lt;/title&gt;
...

However, the above doesn't appear to work when using w3.org's validator as it tries to parse it using HTML 4.. This makes older browsers capable of generating the page (I think).

However, adding the following code directly seems to bypass that problem:
Code:
&lt;?php echo "&lt;?xml version=\"1.0\" encoding=\"iso-8859-1\" ?&gt;\n"; ?&gt;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
&lt;html &gt;
&lt;head&gt;
&lt;title&gt;Test page&lt;/title&gt;
...