knockout.js 未捕获的引用错误:无法处理绑定“提交:函数(){返回添加表单提交列表}”

ubbxdtey  于 2022-11-10  发布在  其他
关注(0)|答案(1)|浏览(116)

我真的需要帮助调试这个错误。我有一个项目,我继承了使用KnockoutJS。每一个帮助将不胜感激。
下面是视图的片段

<form action="" method="post" class="text-muted" ko="submit: add_list_form_submit">
  <div class="form-group">
    <label class="control-label">Travel purpose</label>
    <select ko="visible: purposes().length != 0, 
         value: selected, 
         attr: {name: !is_new_purpose() ? 'travel_purpose':'' }"
       class="form-control" 
       required>
       <option style="display: none" value="">Select or add purpose</option>
       <!-- ko foreach: purposes -->
       <option ko="value: $data, text: $data"></option>
       <!-- /ko -->
         <option value="__">Add a new category</option>
    </select>
    <input ko="visible: is_new_purpose, 
        value: travel_purpose, 
        value_update: 'input', 
        attr: { name: is_new_purpose()? Every 'travel_purpose':'' }" 
      class="form-control" 
      type="text" 
      placeholder="enter new travel purpose" />
  </div>
<form>

这是Viewmodel,设置与前面的一样。

function EnterTravelInfoViewmodel() {
    var etm = this;
    // Observables
    etm.purposes    = ko.observableArray();
    etm.selected    = ko.observable('');
    etm.travel_purpose    = ko.observable('');

    // Subscriptions
    etm.selected.subscribe(function(s) {
    });
    // Computed
    etm.is_new_purpose = ko.computed(function() {
        return etm.purposes().length == 0 || etm.selected() == '__';
    });

    // Event handlers
    etm.add_list_form_submit = function() {
if ((!etm.is_new_purpose() && etm.selected() == '') || (etm.is_new_purpose() && etm.travel_purpose() == '')) {
swal({title: "Hold on", text: "Specify a purpose for this travel", type: 'info'});
     return false;
}
     return true;
};

// Init
//------------Get Travel Purposes payload------------
$.post(Me.url_prefix+'lib/bg-manage-travel.php?get_request=get-travel-purposes', {}
, function(data) {
etm.purposes( JSON.parse(data) );
});

还有其他几个视图模型通过switch循环绑定

$(function() {
    switch(where) {
        case 'login':
            VM = new LoginViewmodel();
            break;
        case 'manage-production-stages':
            VM = new ManageProductionStagesViewmodel();
            break;
        case 'enter-travel-info':
            VM = new EnterTravelInfoViewmodel();
            break;
    }
    ko.applyBindings(VM);
});

另外,请注意数据绑定已经被重新分配,这就是我在视图中使用“ko”的原因。

//----------Change `ko` attribs to `data-bind`-------------
$(function() {
    $('[ko]').renameAttr('ko','data-bind');
});

再次提前感谢您。

j2cgzkjk

j2cgzkjk1#

由于浏览器已缓存了我的历史记录,因此未绑定视图模型。清除浏览器缓存可解决此问题。

相关问题