Question

我一直在努力让jQuery.tmpl（）使用我通过JSTL创建的JSON文件来填充JSP页面。

JSON（/misc/managed_solutions/results.htm）：

    var dataTable = [

            {
                firmName: "name",
                portfolioName: "Fund Allocation Portfolio",
                firmAum: "3.2394E8",
                portfolioAum: "2.3659865E7",
                objTypeDesc: "Capital Preservation/Current Income",
                gipsFlg: "Yes",
                inceptionDt: "01/01/2000",
                stateProvCd: "CA",
                pdfFileNm: "TremendousGrowth.pdf",
                agencyNm1: "name",
                agencyNm2: "name",
                agencyNm3: "name",
                agencyNm4: "name"
            }
            ,
            {
                firmName: "name",
                portfolioName: "Capital Allocation Portfolio",
                firmAum: "4.2394E8",
                portfolioAum: "4.3659865E7",
                objTypeDesc: "Capital Appreciation - Aggressive",
                gipsFlg: "Yes",
                inceptionDt: "01/01/2005",
                stateProvCd: "CA",
                pdfFileNm: "CapitalAllocation.pdf",
                agencyNm1: "name",
                agencyNm2: "name",
                agencyNm3: "name",
                agencyNm4: "name"
            }
            ,
            {
                firmName: "name",
                portfolioName: "name",
                firmAum: "2.2394E8",
                portfolioAum: "1.3659865E7",
                objTypeDesc: "Capital Appreciation - Moderate",
                gipsFlg: "No",
                inceptionDt: "01/01/2008",
                stateProvCd: "TX",
                pdfFileNm: "Global Core Equity.pdf",
                agencyNm1: "name",
                agencyNm2: "name",
                agencyNm3: "name",
                agencyNm4: "name"
            }

];

jQuery JS

function getPortfolioData( start ) {

    var markup = "<tr>" +
                    "<td><p>${firmName}</p>" +
                        "<a href='/path/to/content/${pdfFileNm}'>${portfolioName}</a>" +
                    "</td>" +
                    "<td>" +
                        "<p>${firmAum}</p>" +
                        "<p>${portfolioAum}</p>" +
                    "</td>" +
                    "<td>" +
                        "<p>${objTypeDesc}</p>" +
                    "</td>" +
                    "<td>" +
                        "<p>${gipsFlg}</p>" +
                    "</td>" +
                    "<td>" +
                        "<p>${inceptionDt}</p>" +
                    "</td>" +
                    "<td>" +
                        "<p>${agencyNm1}</p>" +
                        "<p>${agencyNm2}</p>" +
                        "<p>${agencyNm3}</p>" +
                        "<p>${agencyNm4}</p>" +
                    "</td>" +
                    "<td>" +
                        "<p>${stateProvCd}</p>" +
                    "</td>" +
                 "</tr>";

    $.template( "portfoliosTemplate", markup );

    $.ajax({
        dataType: "jsonp",
        url: '/misc/managed_solutions/results.htm?startPosition=' + start + '&viewRows=3',
        jsonp: "$callback",
        success: showPortfolio()
    });

    function showPortfolio(dataTable) {

        // Remove current set of portfolio items
        $( ".data-table.tpm tbody" ).empty();

        // Render the template items for each portfolio
        $.tmpl( "portfoliosTemplate", dataTable ).appendTo( ".data-table.tpm tbody" );
    }
}

HTML

<table class="data-table tpm">
    <tbody>
    </tbody>
</table>

RESULT

<table class="data-table tpm">  
    <tbody>
        <tr>
            <td>
                <p></p>
                <a href="/path/to/content/"></a>
            </td>
            <td>
                <p></p>
                <p></p>
            </td>
            <td>
                <p></p>
            </td>
            <td>
                <p></p>
            </td>
            <td>
                <p></p>
            </td>
            <td>
                <p></p>
                <p></p>
                <p></p>
                <p></p>
            </td>
            <td>
                <p></p>
            </td>
        </tr>
    </tbody>
</table>

我设法让html标记在tbody中显示，但没有一个值。此外，标记只显示一次，告诉我没有发生迭代。

有什么想法吗？

DKM

Answer 1

鉴于您的标记，数据和JavaScript，您的代码可以正常运行：

示例： http://jsfiddle.net/Xdw2v/

我有一种预感，你看到的问题来自你的AJAX电话：

$.ajax({
    dataType: "jsonp",
    url: '/misc/managed_solutions/results.htm?startPosition=' + start + '&viewRows=3',
    jsonp: "$callback",
    success: showPortfolio()
});

具体来说，success属性设置为执行showPortfolio()方法的结果。这导致您的模板立即呈现（没有数据）。我想你真的想要：

success: showPortfolio

即对showPortfolio方法的引用，而不是对其执行结果的引用。

jQuery模板数据显示问题

1 个答案: