Question

我是Jquery DataTables的noob。关于如何使用排序插件，我有一个非常基本的问题：在Google上搜索了很多内容，但是我没有得到正确答案，关于如何将它们合并到我的代码中

<html>
<head>
  <link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css">
</head>
<body>
<table  id="kiran">
        <thead>
                    <tr>
                      <th class="hidden-480">Name</th>
                      <th class="hidden-480">Price</th>
                    </tr>
                  </thead>
                  <tbody>
                  </tbody>
  </table>
  <script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
  <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.4/js/jquery.dataTables.min.js"></script>
  <script>
  $(function(){
    //$("#kiran").dataTable();

     $('#kiran').dataTable({

         "order": [[ 1, "desc" ]],
          "aaSorting": [[1, 'desc']],



       });


    displayData();
  })

function displayData()
{

  var json = [
    {
        "Name": "ONE",
        "Price": "12"
    },
    {
        "Name": "TWO",
        "Price": "100"
    },
    {
        "Name": "THREE",
        "Price": "42"
    }
]



for(var i=0;i<json.length;i++)
{

var name = json[i].Name;
var price = json[i].Price;

              $('<tr>').append(
              $("<td width='20%''>").text(name),
                $("<td  width='25%'>").text(price)

              ).appendTo('#kiran');


}

}


  </script>
</body>
</html>

这是我的jsfiddle

http://jsfiddle.net/pg1k5aww/

有人可以帮忙解决这个问题吗？

Answer 1

像@charlietfl说的那样，你不能直接将数据渲染到表格中，我在你的方法中做了一些改变，这是我的方法。 http://jsfiddle.net/5tszcz2q/

我将数据移动到var

var data = [
    {
        "Name": "ONE",
        "Price": "12"
    },
    {
        "Name": "TWO",
        "Price": "100"
    },
    {
        "Name": "THREE",
        "Price": "42"
    }
];

然后我将数据库更改为此配置

"aaData": data, //set the datatables data to the json var previously created
//mapped each column to the respective data it must present
"aoColumns": [
    { "mData": "Name" }, 
    { "mData": "Price" },
 ],

Jquery Datatables如何在排序顺序中显示价格结果？

1 个答案: