重置表格時未觸發敲除綁定

Question

我有一個與this question類似的問題，我無法找到解決方案。在視圖

<div class="validation-summary-errors"> 
    <span data-bind="visible: $root.addErrors().length > 0">Please correct the following errors:</span> 
    <!-- ko foreach: $root.addErrors --> 
    <ul data-bind="text: error"></ul> 
    <!-- /ko --> 
</div> 

我有這樣的約束力和在js我有這兩種方法和observableArray

this.addErrors = ko.observableArray(); 

this.deactiveAddForm = function() { 
    self.addFormIsActive(false); 
    self.hasReminder(false); 
    self.addErrors([]); 
    utils.resetForm('addEventForm'); 
}; 

this.add = function() { 
    var form = document.getElementById('addEventForm'); 
    if ($(form).valid()) { 
     $.ajax({ 
      url: form.action, 
      type: form.method, 
      data: $(form).serialize() 
     }).done(function (result) { 
      if (result.valError) { 
       self.addErrors(ko.utils.arrayMap(result.addErrors, function (addError) { 
        return { error: addError }; 
       })); 
      } else { 
       self.deactiveAddForm(); 
       submissionSuccess(result.groups); 
      } 
     }).fail(function (jqXHr, textStatus, errorThrown) { 
      self.addErrors([{ error: errorThrown }]); 
     }); 
    } 
    return false; 
}; 

的問題是，調用utils.resetForm（「addEventForm」）防止結合工作所以錯誤不會顯示在視圖中（儘管存在於可觀察數組中）。

下面是這個方法

resetForm: function (id) { 
    var addForm = $(document.getElementById(id)); 

    if (addForm.length > 0) { 
     addForm[0].reset(); 

     // Clear the inputs 
     addForm.find('input:text, input:password, input:file, select, textarea').val(''); 
     addForm.find('input:radio, input:checkbox').removeAttr('checked').removeAttr('selected'); 
     $(".selectMenu").trigger("liszt:updated"); 
    } 
}, 

我不能self.addErrors.valueHasMutated觸發它（）

是否有強迫可見結合工作的一種方式？

感謝

Answer 1

我覺得這個代碼是你的問題，我不親淘汰賽，但沒有這樣做之前

self.addErrors(ko.utils.arrayMap(result.addErrors, function (addError) { 
       return { error: addError }; 
      })); 

也許寧願做

self.addErrors.push({error: 'error'}); 

，看看是什麼發生

如果不解決這個問題，你可以創建一個問題上的jsfiddle？

UPDATE

看一看這個fiddle

因此，對於你的代碼：

var vm = function() { 
    var self = this; 

    self.addErrors = ko.observableArray(); 

    self.deactiveAddForm = function() { 
     self.addFormIsActive(false); 
     self.hasReminder(false); 
     self.addErrors([]); 
     utils.resetForm('addEventForm'); 
    }; 

    self.add = function() { 
     if ($(form).valid()) { 
      $.ajax({ 
       url: form.action, 
       type: form.method, 
       data: $(form).serialize() 
      }).done(function (result) { 
       if (result.valError) { 
        self.addErrors.push({ 
         error: result.addErrors 
        }); 


       } else { 
        self.deactiveAddForm(); 
        submissionSuccess(result.groups); 
       } 
      }).fail(function (jqXHr, textStatus, errorThrown) { 
       self.addErrors.push({ 
        error: errorThrown 
       }); 
      }); 
     } 
     return false; 


    }; 


}; 

Answer 2

您需要設置正確的上下文。

function viewModel() { 
    var self = this; 

    self.addFormIsActive = ko.observable(); 
    self.hasReminder = ko.observable(true); 
    self.addErrors = ko.observableArray(); 

    self.deactiveAddForm = function() { 
     self.addFormIsActive(false); 
     self.hasReminder(false); 
     self.addErrors([]); 
     utils.resetForm('addEventForm'); 
    }; 

    self.add = function() { 
     var form = document.getElementById('addEventForm'); 
     if ($(form).valid()) { 
      $.ajax({ 
       url: form.action, 
       type: form.method, 
       data: $(form).serialize() 
      }).done(function (result) { 
       if (result.valError) { 
        self.addErrors(ko.utils.arrayMap(result.addErrors, function (addError) { 
         return { error: addError }; 
        })); 
       } else { 
        self.deactiveAddForm(); 
        submissionSuccess(result.groups); 
       } 
      }).fail(function (jqXHr, textStatus, errorThrown) { 
       self.addErrors([{ error: errorThrown }]); 
      }); 
     } 
     return false; 
    }; 
} 

ko.applyBindings(new viewModel()); 

this.addErrors（）在您的示例中不再等於self.addErrors（）。

此外，如前所述，您.push（）到一個數組，你不這樣做不管它是你正在試圖做...

self.addErrors.push(whateverError);