7

jquery クイックサーチを使用して、ノックアウト foreach ループによってデータが取り込まれているテーブルを検索しています。foreach が終了した後、quicksearch 要素を開始する必要があります。いくつかのアプローチを試みましたが、これまでのところ成功していません。

「afterRender」を使用してみましたが、現在のアイテムがコレクションの最後のアイテムであるかどうかを判断できませんでした。bindingHandlers も使用してみましたが、長さ 2005 ではなく長さ 0 のコレクションを取得しました。

それで：

  1. foreach ループの最後の要素を見つける最善の方法は何ですか?
  2. この特定のシナリオでそれを実装する最良の方法は何ですか?

これが私の見解です：

    <tbody data-bind="foreach: containers">
        <tr>
            <td><span data-bind="text: code"></span></td>
            <td><span data-bind="text: typeName"></span></td>
            <td><span data-bind="text: parentClient"></span></td>
            <td><span data-bind="text: client"></span></td>
            <td>
                <a data-bind="attr: { onclick: deleteUrl }">
                    <i class="icon-trash"></i>@delete </a>
                |
                <a data-bind="attr: { href: editUrl }">
                    <i class="icon-edit"></i>@edit</a>
                |
                <a data-bind="attr: { href: qrUrl }" target="blank">
                    <i class="icon-qrcode"></i>
                    @printQr
                </a>
            </td>

        </tr>
    </tbody>

ここに私のノックアウトコードがあります：

function Container(data) {
        var self = this;
        self.id = ko.observable(data.Id);
        self.code = ko.observable(data.Code);
        self.typeName = ko.observable(data.TypeName);
        self.parentClient = ko.observable(data.ParentClient);
        self.client = ko.observable(data.Client);
        self.deleteUrl = ko.computed(function () {
            return "GetModal('/Containers/Delete/" + data.Id + "','containerModal');";
        });
        self.editUrl = ko.computed(function () {
            return '/Containers/Edit/' + data.Id;
        });

        self.qrUrl = ko.computed(function () {
            return '/Qr/Index/10?entity=' + data.Id;
        });
    }
 function ContainersViewModel() {
        var self = this;
        self.containers = ko.observableArray([]);
        self.counter = ko.computed(function () {
            return self.containers().length;
        });

        $.getJSON("/Containers/Json", function (data) {
            var containers = $.map(data, function (item) {
                return new Container(item);
            });

            self.containers(containers);
        });

    };
    ko.applyBindings(new ContainersViewModel());

どうもありがとう ！

ニール

4

5 に答える 5

4

foreach binding afterRender オプションは、探していることを実行できます。トリックの部分は、要素が最後の要素であることを知ることができることです。これは、 http://jsfiddle.net/n54Xd/に示されているように、提供された引数を使用して解決できます。

関数：

this.myPostProcessingLogic = function(elements, data) {
    if(this.foreach[this.foreach.length-1] === data)
        console.log("list is rendered");
};

すべての要素に対して呼び出されますが、「if」により、コードが最後の要素に対してのみ実行されるようになります。

于 2013-05-05T21:16:21.330 に答える