无法使用knockout绑定bootstrap模型文本字段

时间:2017-06-15 15:03:50

标签: javascript knockout.js bootstrap-modal

我有一个单击按钮时显示的引导模式。虽然我能够绑定视图中的所有值,但我无法使用knockout绑定模态属性。

这是我的模态代码:

  <div class="form-group">
      <label class="control-label col-xs-3" for="clientName">Client Name</label>
      <div class="col-xs-8 input-group">
            <input name="clientName" class="form-control" required id="clientName" data-bind="textInput: clientName">
      </div>                          
  </div>

这是我的Javascript代码:

self.clientName = ko.observable();
self.onAddNewClient = function () {
       $("#clientProperties").modal({ backdrop: "static" });
  };
self.onSaveClientProperties = function () {
        var item=self.clientName();

 };

模态显示得很好但是当我在文本字段中输入一个值并保存它时,'clientName'变量是未定义的,而是具有输入的值。 'onSaveClientProperties'是在模态上单击按钮时运行的函数。

谢谢!

2 个答案:

答案 0 :(得分:0)

我不知道你是如何设置你的模态的,但是我写了一个看起来像你想做的东西: binding input in modal

<body>


  <div id="clientProperties" class="modal fade" tabindex="-1">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span> <span class="sr-only">Close</span></button>
          <h4 class="modal-title" id="myModalLabel">Client</h4>
        </div>
        <div class="modal-body">
          <div class="row">
            <div class="col-md-6">
              <input name="clientName" class="form-control" required id="clientName" data-bind="textInput: clientName">
              <a href="#" data-bind="click: onSaveClientProperties" >save</a>
            </div>

              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

<a href="#" data-toggle="modal" data-target="#clientProperties"> Add new Client</a>

答案 1 :(得分:0)

好的,我发现了这个问题。我使用VS 2015 ASP.NET单页模板创建了我的项目,它使用了Knockout-2.3.0.debug.js。首先,该资源没有被加载,因为它没有包含在默认的淘汰赛包中,所以我这样做了,它仍然无法正常工作。我将我的淘汰赛更新为Knockout3.4.2并且瞧它工作了。

不确定为什么VS2015没有更新到最新版本的Knockout。