Knockout Bootstrap模态噩梦

Question

我有一个使用Bootstrap模式窗口的Twitter Bootstrap应用程序。该页面使用knockout js构建。该页面是一个包含10行的SPA。每行都有自己的隐藏模态窗口，当用户单击按钮时会出现该窗口。但是模态框有一个文本框，由于某种原因无法编辑。所有浏览器都会发生同样的情况。

每个模态都包含一个表单元素。

<!-- ko foreach: talks -->
<div data-bind="showModal: $data.ShowModal" class="modal fade">
    <form class="form-horizontal" method="POST" 
        action="#" 
        data-bind="submit: $root.createTalk, attr: { 'id': $data.ModalId }" enctype = "multipart/form-data">
        <div class="modal-header">
            <h3>Add Talk</h3>
        </div>
        <div class="modal-body">
<div class="control-group">
                <label class="control-label" >Title:</label>
                <div class="controls">
                    <input name="title" data-bind="value: $data.Title, attr: { 'id': $data.TitleIdStr() }" type="text" />

每个输入框都有一个唯一的ID，表单是唯一的。我真的不明白为什么会一直这样。

任何帮助表示感谢。