0

初めてknockoutjsを使用して問題に苦しんでいます。

検索文字列用のテキストボックスがあります:

<input type="text" data-bind="value: searchString" id="searchText">

そしてボタン:

<span data-bind="click: searchButton" id="searchBtn"></span>

両方とも、次のスクリプトを使用してノックアウトを使用してバインドされています。

function ViewModel() {
        var self = this;

        //-----
        self.searchButton = function () {
            if (self.searchString() != null && self.searchString().length > 3) {
                $.ajax({
                    type: "post",
                    contentType: "application/json",
                    url: "./SearchCustomer/",
                    data: "{'searchString':'" + self.searchString() + "'}",
                    error: function (xhr, status, error) {
                        baseShowError("Error");
                    },
                    success: function (response) {
                        var receivedResponse = JSON.parse(response);
                        if (receivedResponse.Success) {
                            ko.mapping.fromJS(receivedResponse.Result, {}, self);
                        } else {
                            baseShowError("customer not found");
                        }
                    }
                });
            }
        };
    });

$(function () {
        var jsonModel = '@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(this.Model, new Newtonsoft.Json.Converters.IsoDateTimeConverter()))';
        var myViewModel = ko.mapping.fromJSON(jsonModel, {}, new ViewModel());
        ko.applyBindings(myViewModel);
    });

今、スクリプトを使用してテキストボックスに入力をキャッチしたい:

$(document).ready(function () {
            $('#searchText').keypress(function (e) {
                if (e.which == 13) {
                    ...........
                }
            });
        });

唯一の問題は、ドットの代わりに何を入力するかです。目立たないイベント処理について読みましたが、それが試したことは何もないようです。誰かが私にヒントを与えることができますか?

4

2 に答える 2

-1

「入力」をキャッチすることは有効な解決策のようですが、答えははるかに簡単です。

クリックをボタンにバインドする代わりに、2 つの要素の上に配置されたフォームに送信をバインドできます。

解決策: ViewModel は同じままです。

<form data-bind="submit: seachButton">
    <input type="text" data-bind="value: searchString">
    <span data-bind="click: searchButton"></span>
</form>

ご覧のとおり、data-bind が新しいフォーム タグに追加されています。

(通常、ボタンが実際に入力タイプのボタンである場合、おそらくデクリックバインディングを削除できます...テストされていません)

于 2013-10-08T09:36:34.360 に答える