Question

我已经决定使用Footable部门在现有的Web框架内提供响应式网格布局。一个额外的想法是使网格可编辑，我已经设法使用KnockoutJS。我在尝试绑定隐藏的字段行中的输入字段时发现了一个有趣的影响。

如果我使用元素显示我的rowdata的只读视图，那么当我按下扩展行的+符号时，敲除绑定工作正常并且所有行都显示数据，但如果我用a替换标签则文本框为空。脏标志也不响应更改。

设置为在主行中显示的任何字段都显示值正常，并在编辑时触发脏标记，但如果我缩小浏览器窗口，它们将变为空白。

鉴于普通标签元素绑定在第二行足迹中没有问题，任何人都可以建议为什么绑定在输入时失败？如果它是Knockout或Footable，我无法解决。

谢谢，

史蒂夫

Answer 1

[足迹现在支持从2.0.3开始]

Footable本身不能正确支持表单输入元素。在我们的项目中，我们有多个页面需要编辑，我更改了可打开的代码以启用编辑。您可以尝试使用以下内容，它还包括文档：

https://github.com/bradvin/FooTable/pull/285

我们的想法是为每个具有唯一ID的td创建一个数据变量，并将其绑定到行及其详细信息，并根据可见性将内容从行分离到详细信息，反之亦然。

<强>行

<tr class="footable-detail-show" style="display: table-row;">
    ....
    <td style="display: none;" data-bind-name="bind-1413864326707-4"></td>
    ....
</tr>

<强>详情

<tr class="footable-row-detail">
    ....
        <div class="footable-row-detail-value" data-bind-value="bind-1413864326707-4">
            <input id="abc" type="text" value="200">
        </div>
    .....
</tr>

为了使它工作，它预计footable在表包含所有数据后初始化（当data-editable =＆＃34; true＆＃34;时不需要），并且所做的任何更改都严格基于说id的输入元素或元素选择器，而不是基于td选择器。例如，保留对#abc的更改，但如果您对<td style="display: none;" data-bind-name="bind-1413864326707-4">进行更改则会丢失。

查看http://jsfiddle.net/habeebhassan/f8L8jt6p/

上的演示

具有KnockoutJS和Footable的可编辑表格

1 个答案: