Question

我是KnockOut的初学者，并获得了一个使用该模型构建模式的项目。有一个搜索栏，您可以在其中搜索用户名并将其添加到列表中。这是添加用户的代码：

                    // binding when a user is selected 
                $('#addUser').bind('typeahead:select', function (event, suggestion) {
                    debugger;
                    var userNameValue = $('#addUser').val(); 
                    var userFromArray = $.grep(self.userNameList(), function (user) { return ko.utils.unwrapObservable(user.value) == userNameValue });
                    // cannot add several times a same user 
                    if (self.userToAdd() && userNameValue != "") {
                        if (userFromArray.length >= 0) {
                            if ($.grep(self.editingUserList.userKeyValues(), function (user) { return ko.utils.unwrapObservable(user.value) == userNameValue }).length == 0) {
                                self.editingUserList.userKeyValues.push(new roleKeyValueModel(userFromArray[0].key, userFromArray[0].value, userFromArray[0].role));
                            } else {
                                jAlertBox('"' + userNameValue + '" @(Resources.IsAlreadyAdded)', "", "info");
                            }
                        } else {
                            debugger;
                            jAlertBox('"' + userNameValue + '" @(Resources.IsUnknown)', "", "warning");
                        }
                    }
                    self.userToAdd("");
                    $('#addUser').typeahead('val', '');
                });

当我打开第一个模态时，它工作正常。但是，当我关闭它并打开第二个模式时，此功能会多次触发并且无法添加任何用户（第一次触发时，它会检测到正确的用户，但第二次触发时会发送空用户名，导致功能无法正常完成。

您能帮我指出什么地方出问题吗？我查了几个小时...

如果需要，我可以添加更多代码。

编辑：更具体地说，如果将模式打开3次，则绑定会触发3次；如果将模式打开4次，则绑定会触发4次，等等...

Answer 1

我能够通过向（'#addUser'）添加唯一标识符来解决此问题。像这样：

@{ Guid uniqueId = Guid.NewGuid(); }

（...）

 <form>
        <div class="shareSearchBar">
            <i class="fa fa-search" aria-hidden="true"></i>
            <input id="addUser_@(uniqueId)" class="typeahead" placeholder="Add a user" data-bind='value: userToAdd, valueUpdate: "keyup"' />
        </div>
    </form>

（...）

并使用ID从#addUser引用引用到新版本。我猜这个元素在关闭模态时没有正确清理/取消绑定。

绑定函数多次触发/ KnockOut

1 个答案: