Question

我的任务是直截了当的：我有一个表格，它将填充JQuery模板，我无法获得它的CSS样式。

为了告诉你所有的赤裸裸的事实，我从这里准备好了css课程：

http://www.csstablegenerator.com/?table_id=68

我从该网站上复制了以下课程：

.CSSTableGenerator {
margin:0px;padding:0px;
width:100%;
box-shadow: 10px 10px 5px #888888;
border:1px solid #000000;

-moz-border-radius-bottomleft:0px;
-webkit-border-bottom-left-radius:0px;
border-bottom-left-radius:0px;

-moz-border-radius-bottomright:0px;
-webkit-border-bottom-right-radius:0px;
border-bottom-right-radius:0px;

-moz-border-radius-topright:0px;
-webkit-border-top-right-radius:0px;
border-top-right-radius:0px;

-moz-border-radius-topleft:0px;
-webkit-border-top-left-radius:0px;
border-top-left-radius:0px;
}

它是css文件的很长一部分，我将它复制到我的site.css的所有末尾。由于某些原因，我无法将其复制到我的问题

好的，这是我的桌子：

<div class="CSSTableGenerator">
<table id="main car table">
    <thead>
        <tr>
            <th>
                Car Id
            </th>
            <th>
                License Plate Number
            </th>
        </tr>
    </thead>
    <tbody id="addCarHere"></tbody>
</table>

好的......我使用这个...

向表中添加行

 <script>
    $(document).ready(function () {
        var listOfCars = [];
        var currenCar = null;
        $.getJSON("api/Car/GetAll", function (result) {
            listOfCars = result;
            alert(listOfCars.length)
            for (var num = 0; num <= listOfCars.length-1; num++) {
                $("#carRow").tmpl(listOfCars[num]).appendTo($("#addCarHere"))
            }
        });
    });
</script>

......没有任何反应。就像在css中没有额外的行!!

更新：这里我正在实现Jquery模板：

<script type="text/template" id="carRow" class="CSSTableGenerator">
<tr data-carid="${ID}">
    <td>${ID}</td>
    <td class="licensePlateNumber">${LicensePlateNumber}</td>

</tr>

Answer 1

假设您正在使用此jQuery模板插件：https://github.com/BorisMoore/jquery-tmpl

修改代码以编译html模板，如下所示：

var markup = $('#carRow').html(); 
$.template( "rowTemplate", markup );
$.tmpl("rowTemplate",listOfCars[num]).appendTo($("#addCarHere"));

如果这对您不起作用，我建议您为SO创建一个jsfiddle来帮助您。

我的表没有从css类获取正文

1 个答案: