Unable to mask a text field

Question

I am trying to mask a text field that is created after an Ajax response. Everyhing is okay with Ajax request and response. To make this i am using jquery maskedinput plugin. I have already imported neccesarry js files to my HTML page. Currently i am unable to do this. I think Ajax loading causes that but i dont know how to fix this problem. Any help will be appriciated. Here is what i tried:

$(document).ready(function(){
   $("#stuPhoneText").mask("(999) 999-9999");
});

@Donal as i said above i have included all neccesary js files. — Tartar, Aug 09 '14 at 17:08
possible duplicate of [Phone mask with jquery](http://stackoverflow.com/questions/11633726/phone-mask-with-jquery) — MH2K9, Aug 09 '14 at 17:10
check this http://stackoverflow.com/questions/9946500/order-of-events-for-dynamically-added-elements-and-masked-input-plugin — Siva.G ツ, Aug 09 '14 at 17:46

jdmeer · Accepted Answer · 2014-08-09T18:42:00.107

My guess is that you need to run

$("#stuPhoneText").mask("(999) 999-9999");

on the 'complete' callback of your ajax function. Not in the document ready.

I'm sure the plugin isn't written in such a way that it constantly examines the entire Dom for new elements matching the ID you specified.

Something like this:

var request = $.ajax({
   url: "targetURL.html",
   type: "POST",
   complete: function(){ $("#stuPhoneText").mask("(999) 999-9999"); },
   dataType: "html"
});

Unable to mask a text field

1 Answers1