Kendo Grid - 将数据打印到表格

时间:2016-12-22 11:57:45

标签: ajax kendo-ui kendo-grid kendo-template

我正在尝试使用kendo template功能在表格中打印以下数据。 这是我通过ajax调用得到的数据:

{"Data":[{"CustomerID":1,"CustomerAltID":"IMI-001","CustomerName":"Henry Ford","Gender":"M"},{"CustomerID":2,"CustomerAltID":"IMI-002","CustomerName":"Bill Gates","Gender":"M"},{"CustomerID":3,"CustomerAltID":"IMI-003","CustomerName":"Muskan Shaik","Gender":"F"},{"CustomerID":4,"CustomerAltID":"IMI-004","CustomerName":"Richard Thrubi","Gender":"M"},{"CustomerID":5,"CustomerAltID":"IMI-005","CustomerName":"Emma Wattson","Gender":"F"},{"CustomerID":6,"CustomerAltID":"IMI-001","CustomerName":"Henry Ford","Gender":"M"},{"CustomerID":7,"CustomerAltID":"IMI-002","CustomerName":"Bill Gates","Gender":"M"},{"CustomerID":8,"CustomerAltID":"IMI-003","CustomerName":"Muskan Shaik","Gender":"F"},{"CustomerID":9,"CustomerAltID":"IMI-004","CustomerName":"Richard Thrubi","Gender":"M"},{"CustomerID":10,"CustomerAltID":"IMI-005","CustomerName":"Emma Wattson","Gender":"F"},{"CustomerID":11,"CustomerAltID":"IMI-001","CustomerName":"Henry Ford","Gender":"M"},{"CustomerID":12,"CustomerAltID":"IMI-002","CustomerName":"Bill Gates","Gender":"M"},{"CustomerID":13,"CustomerAltID":"IMI-003","CustomerName":"Muskan Shaik","Gender":"F"},{"CustomerID":14,"CustomerAltID":"IMI-004","CustomerName":"Richard Thrubi","Gender":"M"},{"CustomerID":15,"CustomerAltID":"IMI-005","CustomerName":"Emma Wattson","Gender":"F"}],"Total":15,"AggregateResults":null,"Errors":null}

以下是我试图打印它的方法:

<script id="javascriptTemplate" type="text/x-kendo-template">

    <table>
        <thead>
            <tr>
                <th>Customer ID</th>
                <th>ID</th>
                <th>Customer name</th>
                <th>Gender</th>
            </tr>
        </thead>
        <tbody>
            # for (var i=0; i < data.length; i++){ console.log(Object.keys(data[i]));#
            <tr>
                # var keys = Object.keys(data[i]) #
               # for (var j=1; j < keys.length; j++){ console.log(keys[j]); #
                <td>
                    #= data[i][keys[j]] #
                </td>
                # } #
            </tr>
            # } #
        </tbody>
    </table>

</script>

赫斯&#39;我的ajax电话:

<script>

    $.ajax(
        {
            type: 'POST',
            url: '/default1/KendoDataAjaxHandle/',
            dataType: 'json',
            success: function (result) {


                //Get the external template definition using a jQuery selector
                var template = kendo.template($("#javascriptTemplate").html());

                //console.log(result);
                var results = template(results); //Execute the template
                //console.log(results);
                $("#example").html(results); //Append the result

            }
        })

</script>

有人可以告诉我如何打印数据,因为我没有在表中获得任何数据。

1 个答案:

答案 0 :(得分:1)

考虑您的这些数据

{"Data":[{"CustomerID":1,"CustomerAltID":"IMI-001","CustomerName":"Henry Ford","Gender":"M"}],"Total":15,"AggregateResults":null,"Errors":null}

问题:您是否未将正确的数据分配给模板..

var results = template(results); //results are not the expected object

解决方案:您需要将results.Data传递给模板。所以使用这一行。

var results = template(results.Data); //pass data to the template.