Question

我在表单元素上使用submit绑定处理程序。关注第二行中的“Invoice＃”文本框，用户应该只需按Enter键，此时将调用self.Next()函数。但是，如果禁用表单中的第一个按钮元素，则submit处理程序将失败。

我尝试使用disabled属性禁用该按钮，并使用data-bind="enable:false"属性，但这无关紧要。我试过移动HTML元素，但似乎无论我在表单中有什么元素，如果第一个是禁用的按钮，submit绑定处理程序失败。

这是我的HTML：

<div id="search-form" class="container">
    <form name="my-form" data-bind="submit: Next">
        <div class="row">
            <div class="col-xs-12">
                <button class="btn btn-default"><!-- disabled or data-bind="enable: false" -->
                    <i class="fa fa-save"></i>
                </button>
                <button class="btn btn-default" disabled>
                    <i class="fa fa-print"></i>
                </button>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-2">
                <label class="control-label">Invoice #</label>
                <input type="text" class="form-control" data-bind="value: InvoiceID"  autofocus="true"  />
            </div>
            <div class="col-xs-8">
                <button class="btn btn-success pull-right" type="submit" data-bind="click: Next">Next</button>
            </div>
        </div>
    </form>
</div>

此HTML有效，但我已注释掉已禁用的属性。

关于发生了什么的任何想法？

由于

编辑我应该包括我在控制台中没有看到任何错误，并且我在渲染的HTML中看不到任何看起来像原因的内容。

Answer 1

这不是一个淘汰赛问题，但实际形式submit事件，即触发淘汰逻辑的事件，并未触发。（您可以通过在Chrome开发工具中的submit事件上设置事件断点来查看此事件：仅在未禁用第一个按钮时触发事件。

解决方案就是在按钮上添加type="button"非提交按钮。

（Working fiddle添加类型“按钮”后，两个按钮都被禁用。）

Knockout提交绑定处理程序失败，禁用按钮

1 个答案: