2016-09-29 59 views
-1

我正嘗試將jasny bootstrap輸入掩碼應用於使用淘汰賽的數據綁定文本輸入。然而,只有在您點擊輸入框後,數據遮罩纔會顯示出來。我不知道爲什麼。我希望輸入掩碼馬上顯示出來。這裏是小提琴。 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' 
    }) 
}); 

一定要刪除你的數據掩碼屬性爲好。

JS Fiddle example