-1

ノックアウトを使用してデータバインドされているテキスト入力にjasnyブートストラップ入力マスクを適用しようとしています。ただし、入力ボックスをクリックするまで、データマスクは表示されません。なぜ私は分からない。私は入力マスクをすぐに表示したいです。ここはフィドルです。 http://jsfiddle.net/LkqTU/31938/ノックアウトロードでjasny入力マスクを適用する

は、ここでは、HTML

<div class="container"> 
    <table class="table table-condensed table-hover"> 
    <thead> 
     <tr> 
     <th>First Name</th> 
     <th>Last Name</th> 
     <th>Phone</th> 
     </tr> 
    </thead> 
    <tbody data-bind='foreach: employees'> 
     <tr> 
     <td data-bind='text: firstName'></td> 
     <td data-bind='text: lastName'></td> 
     <td> 
      <input type="text" class="form-control" data-bind="value: phone" data-mask="999-999-9999"> 
     </td> 
     </tr> 
    </tbody> 
    </table> 
</div> 

であり、ここではJavaScriptです。

function employee(firstName, lastName, phone) { 
    this.firstName = ko.observable(firstName); 
    this.lastName = ko.observable(lastName); 
    this.phone = ko.observable(phone); 

} 

function model() { 
    var self = this; 
    this.employees = ko.observableArray(""); 
} 

var mymodel = new model(); 

$(document).ready(function() { 
    loaddata(); 
    ko.applyBindings(mymodel); 
}); 

function loaddata() { 
    mymodel.employees.push(new employee("Bob", "Jones", "7174569876")); 
    mymodel.employees.push(new employee("Mary", "Smith", "3457892435")); 
    mymodel.employees.push(new employee("Greg", "Black", "3557689800")); 
} 

答えて

1

あなたノックアウトバインディングが適用された後、文書の負荷に入力マスクを初期化してみてください。

$(document).ready(function() { 
    loaddata(); 
    ko.applyBindings(mymodel); 
    $('.form-control').inputmask({ 
     mask: '999-999-9999' 
    }) 
}); 

は同様にあなたのデータ-mask属性を削除してください。

JS Fiddle example

関連する問題