1

更新：我还希望升序/降序箭头键适当地出现在单击以显示当前排序顺序的标题旁边。我已经用油漆制作了图像，并确保它们像 12 x 10 像素。

我做了很多搜索，似乎没有下载文件就无法完成。我想使用我目前必须以某种方式最初让我的 HTML 表按从私有服务器动态填充的某个列的值排序的代码。

我正在使用 Knockoutjs 进行所有数据绑定。

当我单击列的标题时，排序工作正常。它目前每隔一次单击将其按升序/降序排列（单击一次：降序，再次单击：升序，再次单击：降序......）。我想用已经使用我已经拥有的代码（如果可能的话）按降序排序的 TimeObserved 信息来填充表格。任何帮助表示赞赏。

请注意：我对这一切都很陌生，我从个人经验中知道，有人可能会要求将其放入 jsfiddle。我不习惯 jsfiddle 并且忙于工作。请理解，我现在没有时间将其转换为那种格式，并且提供的代码应该不仅仅是信息丰富且有条理的阅读和理解。谢谢你。

这是此操作所需的代码片段：

HTML 文件：

///////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// ////////////////////

<table border="6" id="widget"><thead>
    <tr>
        <th><a href=#" data-bind="click: SortByTimeObserved">TimeObserved</a></th>
    </tr></thead>

    <tbody data-bind="foreach: rows">
        <td><input data-bind="value: TimeObserved" /></td>
    </tbody>
</table>

<script src="TableViewModel.js" type="text/javascript"></script>

///////////////////////////////////////// ///////////////////////////////////////// ///////////////////////////////////////// /////////////////////

继承人的 javascript 视图模型文件：

==================================================== =================================

function Event(TimeObserved){
    var self = this;
    self.TimeObserved = TimeObserved;
}

function TableViewModel(){
    var self = this;
    self.sortColumn = "TimeObserved";
    self.sortAscending = true;

    self.SortByTimeObserved(){
        if(self.sortColumn == "TimeObserved")
            self.sortAscending = !self.sortAscending;
        else{
            self.sortColumn = "TimeObservable";
            self.sortAscending = true;
        }
        self.rows.sort(function(a,b){
            if(self.sortAscending == true)
                for(self.TimeObserved in self.rows)
                    return a.TimeObserved > b.TimeObserved ? -1 : 1;
             else
                 return a.TimeObserved < b.TimeObserved ? -1 : 1;
        });
    }
}

this.Model = new TableViewModel;
ko.applyBindings(this.Model);

==================================================== =================================

4

3 回答 3

2

看看 Ko Grid。我敢打赌它会给你你所需要的：

https://github.com/ericmbarnard/KoGrid

于 2012-04-18T16:12:17.630 回答
0

你不能用一些脚本来初始化它......

this.Model = new TableViewModel;
this.Model.sortAscending = false;
this.Model.SortByTimeObserved();
ko.applyBindings(this.Model);
于 2012-04-18T15:17:51.723 回答
0

我解决了。当我使用：

function getEvents(){
    $.getJSON("http://.....",
        function (data){
            $.each(data.d, function (i, item){
                handleEvent(item)
            });
        Model.SortByTimeObserved(); // <----This is what solved the problem
        }
    );
 }

the Model.SortByTimeObservable();在我用来自服务器的项目填充handleEvent 之后添加，然后TimeObserved以正确的顺序订购。不需要文件this.Model.SortByTimeObserved();末尾的 ，因为它只会以相反的顺序放置所有内容。ViewModel.js

于 2012-04-19T14:28:17.727 回答