使用Mustache.js和Bootstrap无法正确呈现表

时间:2014-10-20 03:16:49

标签: javascript jquery html twitter-bootstrap mustache

我尝试使用Mustache.js但是在创建表时却没有正确应用Boostrap类。只有标题才能获得css。我尝试在单击按钮后使用jquery应用该类但没有帮助。我也尝试在表格中嵌入模板,但id不起作用。

我有这个HTML。

  <table id="mTable" class="table table-striped">
  <tr>
    <th>FY</th>
    <th>COST</th> 
  </tr>
</table>

然后我的模板

<script id="priceTemplate" type="text/template">

  <tr>
    <td>{{FY}}</td>
        <td>{{COST}}</td>

  </tr>
  </script>

我的Ajax代码。

    $('#cmdSubmit').on('click', function () {
            event.preventDefault();
            var PriceTemplate = $('#priceTemplate').html();
            $priceTable = $('#mTable');
            $.ajax({
                type: "GET",
                url: "mywebservice.asmx/GetData",
                contentType: "application/json; charset=utf-8",
                datatype: "json",
                success: function (msg) {
                    var pricedata = eval(msg.d);
                    $.each(pricedata, function (i, price) {
                        $priceTable.append(Mustache.render(PriceTemplate, price));

                    });

                }

            });

        });

我的表显示数据,但看起来模板没有通过bootstrap进行风格化。 enter image description here

TIA,

0 个答案:

没有答案