Search code examples
javascripthtmlarraysjspstruts

How do dynamically create HTML via JavaScript using property names in Struts?


Here's my problem:

I have a JavaScript function inside of a JSP that looks like this:

<script type="text/javascript">
function generateTable()
{

    var temp = '';
    temp = temp + '<logic:iterate name="dataList" id="dto" indexId="dtoIndex" >';
    temp = temp + '<logic:equal name="dtoIndex" value="0">';
    temp = temp + '<thead>';
    temp = temp + '<tr class="topexpression7"></tr></thead><tbody></logic:equal>';
    temp = temp + '<tr>';

    var propertyArray = new Array('"title"','"jDate"','"employeeId"','"employeeName"');
    var arrayLength = propertyArray.length;

    var html = '';
    var i=0;
    for (i=0; i<arrayLength; i++)
    {   
        if (i == 2)
        {
            // left
            html = html + '<logic:present name="dto" property=' + propertyArray[i] + '><td class="left">&nbsp;<bean:write name="dto" property=' + propertyArray[i] + '/></td></logic:present>';
        }
        else if (i == 3)
        {
            // Only applies to this property
            html = html + '<logic:present name="dto" property="employeeName">';
            html = html + '<td class="left" style="white-space:nowrap;">&nbsp;';
            html = html + '<nobr><bean:write name="dto" property="employeeName"/>';
            html = html + '</nobr></td></logic:present>';
        }
        else
        {
            // center
            html = html + '<logic:present name="dto" property=' + propertyArray[i] + '><td class="center">&nbsp;<bean:write name="dto" property=' + propertyArray[i] + '/></td></logic:present>';
        }
    }
    temp = temp + html + '</logic:iterate></tbody>';

    // Write out the HTML
    document.writeln(temp);
}
</script>

If I hard code the property like where (i == 3), it works fine. Renders as expected.

But by trying to parse a string dynamically (where i <> 3), the string var "html" is null every time. Admittedly, my JavaScript is average at best. I'm sure it's an easy fix, but darned if I can figure it out!

P.S. Long story as to why I'm going this route, and I'll spare you the story (you're welcome). I just want to know why the variable propertyArray[i] isn't working.


Solution

  • The JSP is rendered on the server and JavaScript on the client browser, but to render properly the JSP tags should be well formed, i.e. have all necessary attributes with valid values, begin and close tag, etc. But not all your tags are valid. First your JSP compiled on the server and it can't process the bad JSP tags. When i != 3 you have that bad JSP tags. When the JSP is compiled the JavaScript code is used like a content, it has less meaning for the JSP compiler because it is looking on the tags that correspond a JSP syntax. Looking by the eyes of the JSP compiler you'll see the logic:present tag has attribute property but has not a value because propertyArray[i] is not evaluated as a JSP expression, it simply breaks the tag boundary. So the Tag is not compiled properly. If you place JSP tags into JavaScript code make sure they're consistent.