0

This should be simple but for some reason I am not getting it right. :/

I am using the jQuery masked input plugin available here

The following is my code snippet:

jQuery:

<script>
$(document).ready(function(){
  $("#newStudentForm").validate();
});
jQuery(function($){
   $("#Sphone").mask("(999) 999-9999");
});
</script>

HTML:

<input type="text" maxlength="10" name="Sphone" id="Sphone"  size="28px"/>

As of now, I cannot see any mask in the textbox. How do I fix this?

numaroth
  • 1,295
  • 4
  • 25
  • 36
Rahul Desai
  • 15,242
  • 19
  • 83
  • 138
  • What version of jQuery are you running? Could you provide more of your page's code? – magzalez Apr 16 '12 at 17:14
  • This really looks like copy&paste from two different sources. or why else do you mix the two ways to register a domready event on the same page? – ThiefMaster Apr 16 '12 at 20:08
  • @ThiefMaster Well, right. The first piece is probably from jQuery Validate. The second piece is from the aforementioned input mask plugin. The answer below is probably the fix, but I think we need to see more of the page to see what else might be going wrong. – magzalez Apr 16 '12 at 20:24
  • @rdesai I think you're going to have to supply a little more code, perhaps a link to the page, so we can help you debug the problem. – magzalez Apr 16 '12 at 20:46
  • @magzalez jQuery: HTML: Student's Phone Number : – Rahul Desai Apr 16 '12 at 21:01
  • Was either answer helpful? If it was, you should accept an answer. If not, you should edit your question or comment again. – magzalez Apr 17 '12 at 22:35

2 Answers2

2

CHECK that you include the plugin file 

<input type="text" maxlength="10" name="Sphone" id="Sphone"  size="28"/> // not `28px`


$(document).ready(function(){
  $("#newStudentForm").validate();
  $("#Sphone").mask("(999) 999-9999");
});
thecodeparadox
  • 86,271
  • 21
  • 138
  • 164
1

Based on the information you gave me, I got it working at http://jsfiddle.net/Sgu6e/.

Here's what I did:

I removed the line $("#rad1").buttonset(); as it did not apply to the code you gave me and was breaking the rest of the JS.

Then I changed the rest of the JS to the following:

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

Again, you can see it working at http://jsfiddle.net/Sgu6e/.

magzalez
  • 1,396
  • 2
  • 14
  • 25
  • I am glad its working for you. I tried it in my code but unfortunately, it is not working for some reason. – Rahul Desai Apr 18 '12 at 14:33
  • Here is my updated code (similar to yours): – Rahul Desai Apr 18 '12 at 14:39
  • Student's Phone Number : I have included jQuery files. Its not working for me, its driving me crazy! Sorry. – Rahul Desai Apr 18 '12 at 14:39
  • You should try making a copy on http://jsfiddle.net. It'll be much more helpful than copying and pasting code into a comment. – magzalez Apr 18 '12 at 16:08