twitter-bootstrap Bootstrap 表 Js 中的 data-sort-name 是如何工作的?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/31518321/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How does data-sort-name in Bootstrap table Js work?
提问by Timsen
I am using folowing library : http://bootstrap-table.wenzhixin.net.cn/documentation/
我正在使用以下库:http: //bootstrap-table.wenzhixin.net.cn/documentation/
I load json objects into this table which works fine, but now here comes the problem. I want to be able to sort columns.
我将 json 对象加载到这个工作正常的表中,但现在问题来了。我希望能够对列进行排序。
My Json layout as folows :
我的 Json 布局如下:
[{"Total": 12345.56, "Name": "Monkey1", "TotalFormatted": "$ 12.345,56"},{"Total": 13345.56, "Name": "Monkey3", "TotalFormatted": "$ 13.345,56"},{"Total": 11345.56, "Name": "Monkey2", "TotalFormatted": "$ 11.345,56"}]
<table id="test" data-page-size="10" data-pagination="true" data-unique-id="true" data-show-footer="false">
<thead>
<tr>
<th data-field="Name">Name</th>
<th data-field="TotalFormatted" data-sort-name="Total" data-sortable="true" data-align="right">TotalFormatted</th>
</tr>
</thead>
</table>
I want to show TotalFormatted data, but i want to sort this column with Total property, since TotalFormatted cant be used for that. In the documentation i saw the following :
我想显示 TotalFormatted 数据,但我想用 Total 属性对此列进行排序,因为 TotalFormatted 不能用于此。在文档中,我看到了以下内容:
data-sort-name : Provide a customizable sort-name, not the default sort-name in the header, or the field name of the column. For example, a column might display the value of fieldName of "html" such as "abc", but a fieldName to sort is "content" with the value of "abc".
data-sort-name :提供可自定义的排序名称,而不是标题中的默认排序名称或列的字段名称。例如,一列可能会显示“html”的 fieldName 值,例如“ abc”,但要排序的 fieldName 是“content”,其值为“abc”。
but how ever data is not sorted correctly, has anyone exprienced this or have i misunderstood something?
但是数据如何没有正确排序,有没有人经历过这个或者我误解了什么?
回答by dreamweiver
Actually data-sort-namedoesn't work that way. the main intention of data-sort-nameoption is to control the default sorting of the table data.
实际上data-sort-name不是那样工作的。data-sort-nameoption的主要目的是控制表格数据的默认排序。
for the data-sort-nameoption to work with default sorting it needs to point to one of the data-fieldattribute of the column in the table.
对于data-sort-name使用默认排序的选项,它需要指向data-field表中列的属性之一。
note : In short data-fieldis like a an id added to each column, which the data-sort-nameoption refers to sort the table on load.
注意:简而言之data-field,就像添加到每列的 id,该data-sort-name选项指的是在加载时对表进行排序。
To understand this better, here is an example with code from Bootstrap site
为了更好地理解这一点,这里有一个来自Bootstrap 站点的代码示例
- try changing the
data-sort-nameto one of the columnsdata-fieldvalue and execute the code, you will understand what I just explained above.
- 尝试将 更改为
data-sort-name列data-field值之一并执行代码,您将理解我上面刚刚解释的内容。
HTML Code:
HTML代码:
<table data-toggle="table"
data-url="https://api.github.com/users/wenzhixin/repos?type=owner&sort=full_name&direction=asc&per_page=100&page=1"
data-sort-name="stargazers_count"
data-sort-order="desc">
<thead>
<tr>
<th data-field="name"
data-sortable="true">
Name
</th>
<th data-field="stargazers_count"
data-sortable="true">
Stars
</th>
<th data-field="forks_count"
data-sortable="true">
Forks
</th>
<th data-field="description"
data-sortable="true">
Description
</th>
</tr>
</thead>
Live demo @ JSFIDDLE: http://jsfiddle.net/dreamweiver/ptxj8Lao/
现场演示@JSFIDDLE:http: //jsfiddle.net/dreamweiver/ptxj8Lao/

