当值通过javascript更改时,元素未更新错误状态

当值通过javascript更改时,元素未更新错误状态,javascript,jquery,asp.net-mvc,knockout.js,Javascript,Jquery,Asp.net Mvc,Knockout.js,我有一个页面,里面有一些敲除,我正试图在其中实现验证。我有一个输入,我允许用户通过如下下拉菜单进行更改: <div class="col-md-6 form-group has-feedback" data-bind="css: { 'has-error': Term.hasError }"> <label for="ddlTerm" class="col-form-label" style="padding: 0;">Term</label>

我有一个页面,里面有一些敲除,我正试图在其中实现验证。我有一个输入,我允许用户通过如下下拉菜单进行更改:

<div class="col-md-6 form-group has-feedback" data-bind="css: { 'has-error': Term.hasError }">
    <label for="ddlTerm" class="col-form-label" style="padding: 0;">Term</label>
    <div class="input-group input-group-sm">
        <input type="text" data-bind="textInput: Term" class="form-control input-sm" id="tbTerm" />
        <div class="input-group-btn">
            <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown">Select <span class="caret"></span></button>
            <ul class="dropdown-menu pull-right">
                <li><a href="javascript:set_Term(12)">12 Months</a></li>
                <li><a href="javascript:set_Term(24)">24 Months</a></li>
                <li><a href="javascript:set_Term(36)">36 Months</a></li>
                <li><a href="javascript:set_Term(48)">48 Months</a></li>
                <li><a href="javascript:set_Term(60)">60 Months</a></li>
                <li><a href="javascript:set_Term(72)">72 Months</a></li>
                <li><a href="javascript:set_Term(84)">84 Months</a></li>
            </ul>
        </div>
    </div>
    <span data-bind='visible: Term.hasError, text: Term.validationMessage' class="help-block"></span>
</div>
该值与以下各项相关:

self.Term = ko.observable('').extend({ required: 'Term is required' });
当值发生变化时,可观测值会更新,但错误状态保持不变,输入保持红色,反馈保持可见。有没有办法强迫输入意识到它的值已经改变,并且应该清除错误

我已经尝试给元素
focus()
,但是没有用

我发现的唯一一件事是给出包含div和验证消息id,然后在JS函数中执行此操作:

  $('#tbTermDiv').removeClass('has-error');
  $('#tbTermNote').addClass('hidden');
这在视觉上起到了作用-错误消息消失,文本框丢失红色,但如果用户再次清空文本框,红色会返回,但消息保持隐藏。。。所以这不是最好的解决方案

我对任何一种解决方案都很满意:击倒、jQuery、纯JS


编辑:我注意到这不会更新可观察的对象,所以当我通过value属性更改输入时,它不会更新可观察的对象

扩展器的工作方式与一般工程中的击倒方式相同。它只知道对视图模型上的可观察对象所做的更改。使用jquery更新UI上控件的值不会更新基础视图模型,因此任何依赖的淘汰代码都不知道如何更新

您可以将set_term函数更改为视图模型上的函数,并让它更新基础的observable而不是控件。然后使用数据绑定来调用函数,而不是原始js

  self.set_Term = function(months) {
      self.Term(months);
  };


是什么导致您的验证出现的?您目前使用的验证库是什么?@JasonSpake我使用的是这里的示例:@JasonSpake我也安装了Eric Barnard的knockout.validation v2.0.3,但我不确定我的设置是否使用了它。我看不出您的配置有任何问题。我使用您的代码和knockout示例中的“必需”扩展器创建了一个快速复制程序。它似乎工作正常?只是在使用了一个集合项函数之后才有问题吗?哦,这里还有更多的问题。这是一个自举下拉列表吗?我曾经想过这种方法,但是因为它已经按照原来的方式设置好了,所以我想找到一种按原样操作的方法。我找到了一个简单的方法,我只是添加了
$('tbTerm').trigger('change')到“set_term”函数,现在它知道输入已更改,因此它更新了可观测值,错误清除。谢谢你的帮助。这个答案是完全可以接受的,但我现在将使用jQuery。
  self.set_Term = function(months) {
      self.Term(months);
  };
  <li><a data-bind="click: function(){set_Term(84)}">84 Months</a></li>