JQuery Template rendering issue

Question

I am using JQuery Template to create a table grid in asp.net. But I am getting rendering problem with it. Here's the code :

<script id="housingTemplate" type="text/x-jquery-tmpl">
    <div class="oddrow togglestyle">
        <div class="oddFirst">
            ${ID}
        </div>
        <div class="oddFirst thirdWidth fourthWidth info-tooltip"
             title="{{ html ProjectName }}">
            ${ProjectName}
        </div>
        <div class="oddFirst thirdWidth fourthWidth info-tooltip"
             title="Ravi Joshi">
            ${Address}
        </div>
        <div class="oddFirst thirdWidth info-tooltip">
            ${ZipCode}
        </div>
        <div class="oddFirst thirdWidth info-tooltip">
            ${City}
        </div>
        <div class="oddFirst thirdWidth info-tooltip">
            ${Type}
        </div>
    </div>
<script>

$("#businessTemplate").tmpl($.parseJSON(data.ResponseData)).appendTo("#dataList");

"title" tag of DIV doesn't rendered back inside "#dataList", jquery template skip that part and render all rest.

I want "title" tag on DIV for TOOLTIP purpose because plugin only support the text written inside "title" tag.

Is there's something i am writing wrong in code ?

Answer 1

Have you tried removing the extra inner spaces:

{{html ProjectName}}

Instead of:

{{ html ProjectName }}

The syntax on the docs page {{html fieldNameOrExpression}} doesn't have any inner spaces.

http://api.jquery.com/template-tag-html/