xeditable 텍스트 상자 안의 마스크 된 입력이 작동하지 않습니다.

Question

사용자 이름을 편집하는 데 사용하는 부트 스트랩 응용 프로그램에 대한 x 편집 가능한 입력이 있습니다. 지금 jquery.maskedinput.min.js를 사용하여 마스킹 된 형식을 가져야합니다. iam이 x- 편집 가능한 범위에서 클릭 할 때 나타나는 텍스트 상자에 입력하는 동안. 내 샘플 HTML 코드

나는이 같은 마스크 입력 함수를 호출하고 때

<div id="sZip" class="profile-info-value "> 
<span class="editable" id="Dob">dob</span> 
</div> 

그리고 난이

$('#zip').editable({ 
        type: 'text', 
        name: 'zip', 
        tpl:' <input type="text" id ="zipiddemo" class="form-control input-sm dd" style="padding-right: 24px;">' 

       }); 

처럼 J 쿼리를 적용하여 편집 할 수있는 X를 achived하고 잘 작동이 지금은 텍스트 상자 마스크 가능을해야하지만,

$(".dd").mask("99999-?9999"); 

그것이 작동하지 않습니다, 나는 정확한 이유를 모른다. 모든 도움을 주실 것입니다

Answer 1

x 편집 가능한 요소가 동적으로 추가 되었기 때문에 작동하지 않습니다.

이 작품이 좋겠습니다.

$('#users a').editable({ 
    type: 'text', 
    name: 'username', 
    tpl: '<input type="text" id ="zipiddemo" class="mask form-control input-sm dd" style="padding-right: 24px;">' 
}); 

$(document).on("focus", ".mask", function() { 
    $(this).mask("(999) 999-9999? x99999"); 
}); 

DEMO

Answer 2

당신은 요소를 찾기 위해

$(".dd").mask("99999-?9999"); 

사용 document를 작동 한 후

$(document).find(".dd").mask("99999-?9999"); 

Answer 3

하거나 할 마스크되지 않습니다 동적 그래서 아래 .dd 입력을 추가 :

Dhiraj의 대답, 부트 스트랩 X-편집 가능한 API에 의해 주어진 inputclass 속성을 사용하는 것 같은 일을 더 우아한 방법을 개선

$('#zip .editable').editable({ 
       type: 'text', 
       name: 'zip', 
       tpl:' <input type="text" id ="zipiddemo" class="form-control input-sm dd" style="padding-right: 24px;">' 

      }).on('shown',function(){ 
$("input#zipiddemo").mask("99-999"); 
    }); 

DEMO

Answer 4

.

<a data-inputclass="mask"></a> <!-- input --> 

$(document).on("focus", ".mask", function() { 
    $(this).mask("(999) 999-9999? x99999"); 
});