Question

我使用knockout.js lib来绑定数据我们有下一个例子 JSFiddle Example

我有数据表。表有列顺序 -

Name - LastName - Middlename - Age
我有4个功能

var namePosition = function()

var lastnamePosition = function()

var middlenamePosition = function()

var agePosition = function()

我希望表中列的绑定顺序为此函数返回的值例如
namePosition返回4
lastnamePosition返回2
middlenamePosition返回1
agePosition返回3
然后表shouls有下一个列顺序 -
Middlename - LastName - Age - Name。
你有什么想法，我该怎么办？（使用knockout或jquery）

Answer 1

您可以使用简单的JS数组作为查找表：

var fields = [];
fields['Name'] = 4; 
fields['LastName'] = 2;
...etc...

然后使用fields['Name']代替代码中的数值。不需要功能。

Answer 2

迪奥杜斯说的是一个很好的方式。您可以使用这些函数生成订单数组：

var order = [];
order[namePosition()] = "name";
order[lastnamePosition()] = "last";
order[middlenamePosition()] = "middle";
order[agePosition()] = "age";

// order===["middle", "last", "age", "name"]

然后将 order observableArray属性设置为您的对象，在创建时使用上述顺序作为初始值。

最后一件事是将单元格顺序和文本绑定到新值：

<table>
   <thead>  
     <tr data-bind="foreach:order">
       <td data-bind="text:$root.headers[$data]"></td>
    </tr>
 </thead>
  <tbody data-bind="foreach:users">   
    <tr data-bind="foreach:$root.order">
        <td><span data-bind="text:$parent[$data]"></span></td>
    </tr>
  </tbody>
</table>

Info about $root and $parent。

使用当前方法，您可以通过以下代码动态更改列顺序：

model.order(["name", "last", "age", "middle"])

此处示例：http://jsfiddle.net/Klaster_1/Pw2VE/1/

Answer 3

我从这个角度来看，表格会有标题，而且这些标题也需要重新订购。如果不是这种情况，你可以完全忽略这个答案。：）

我对Knockout一点也不熟悉 - 我不能确定这不是代码恐怖。

但是，这个小提琴会将列的顺序改为您在示例中给出的列。这些值是硬编码的（如果它是一个合适的方法）它不应该（？）制定一个方法将它们移动到任意位置太麻烦。

此处：http://jsfiddle.net/enhzflep/KKhZg/368/

Html，在表格中更改列顺序

3 个答案: