在对可排序表单元素进行排序后，无法进行初始化清空表单输入的删除操作 [英] Knockout initializing empty form inputs not work after sorting sortable form elements

问题描述

这是小提琴jsfiddle.net/jw7Je

Here is fiddle jsfiddle.net/jw7Je

我有一个绑定到两个模板的视图模型和一个页面中的可编辑表单.

I have a view model bounded to a two templates and an editable form in a single page.

这两个模板最初都加载了示例数据，通过此自定义绑定显示的表单中没有示例数据

The two templates are initially loaded with sample data, The form is displayed without sample data through this custom binding

ko.bindingHandlers.emptyInit = {
    init: function(element, valueAccessor, allBindingsAccessor, 
                   viewModel, bindingContext) 
    {
        element.value = '';
    }
}

<input type="text" data-bind="value: jw_fullname, valueUpdate: 'afterkeydown', emptyInit: emptyInit" placeholder="Full Name" id="jw_fullname" />

最初一切都很好，但是通过敲除可排序，i具有可排序的表格部分.

Everything loads up fine initially, but the i have sortable sections of forms through knockout sortable.

<div data-bind="sortable: data"> 
<div class="item">
       <p class="span6">
       <label>Course Name</label>
       <input type="text" data-bind="valueWithInit: jw_educname, valueUpdate: 'afterkeydown',emptyInit: jw_educname" placeholder="Course Name" class="educname" />
       </p>
       <p class="span6">
       <label>Institution Name</label>
       <input type="text" data-bind="value: jw_eduiname, valueUpdate: 'afterkeydown', emptyInit: jw_eduiname" placeholder="Insitution Name" class="eduiname" />
       </p>
  </div>
</div>

在用户对表单进行更改并对元素进行排序后，尽管视图模型中的值已更新，但相应的元素值再次重置为空.

After the user make the change to the form and sorts the elements, the corresponding elements values resets to empty again, although the values in the view model are updated.

如何在可排序部分的文本框中保留更新的值?

How to retain the updated values in those textboxes in sortable sections ?

我正在尝试

ko.bindingHandlers.emptyInit = {
    init: function(element, valueAccessor, allBindingsAccessor, 
                   viewModel, bindingContext) 
    {

            var value = ko.utils.unwrapObservable(valueAccessor()) || '';

            if (element.value !== value) {
                element.value = value;

            }else {
                element.value = '';
            }

    },
     update: function(element, valueAccessor, allBindingsAccessor, 
                   viewModel, bindingContext) 
     {
              var value = valueAccessor();
            var valueUnwrapped = ko.unwrap(value);
            //console.log(valueUnwrapped);



     }
} 

推荐答案

由于Knockout-sortable删除了移动的元素并在其位置添加了新元素，因此清除了这些字段.

The fields get cleared because Knockout-sortable removes the moved elements and adds new ones in their place.

我发现此请求请求似乎可以解决问题: https://github.com. com/rniemeyer/knockout-sortable/pull/83

I found this pull request that seems to solve the problem: https://github.com/rniemeyer/knockout-sortable/pull/83

这篇关于在对可排序表单元素进行排序后，无法进行初始化清空表单输入的删除操作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！