r2364 - Implemented demos for applying mask to a non-input, allowPartial and 'apply' method.
Author: powella
Date: Mon Mar 23 15:04:07 2009
New Revision: 2364
Modified:
branches/dev/mask/demos/mask/index.html
Log:
Implemented demos for applying mask to a non-input, allowPartial
and 'apply' method.
Modified: branches/dev/mask/demos/mask/index.html
==============================================================================
--- branches/dev/mask/demos/mask/index.html (original)
+++ branches/dev/mask/demos/mask/index.html Mon Mar 23 15:04:07 2009
@@ -22,7 +22,7 @@
$("#phoneExt").mask({mask: "(###) ###-#### x#####"});
$("#iphone").mask({mask: "+33 ### ### ###"});
$("#tin").mask({mask: "##-#######"});
- $("#ssn").mask({mask: "###-##-####"});
+ $("#ssn").mask({mask: "###-##-####", allowPartials: true});
$("#product").mask({mask: "a*-###-a###", placeholder: " " });
$("#eyescript").mask({mask: "~#.## ~#.## ###"});
$("#po").mask({mask: "PO: aaa-###-***"});
@@ -33,10 +33,21 @@
.bind('dblclick.mask', function() { $(this).mask('value'); });
$("#phone").mask('destroy');
+
+ $('#_ButtonChange').click(function(){
+ $("#ssn").val('123456').mask('apply');
+ });
+
+ $('#_ViewTest').mask({mask: '(###) ###-####'});
});
</script>
+
+ <style type="text/css">
+ div.test { background: #7994AB; color:#FFFFFF; padding: 10px; }
+ </style>
+
</head>
<body>
<table>
@@ -69,6 +80,7 @@
<td>SSN</td>
<td><input id="ssn" type="text" tabindex="4"/></td>
<td>###-##-####</td>
+ <td><button type="button" id="_ButtonChange">Change Ssn
Value</button></td>
</tr>
<tr>
<td>Product Key</td>
@@ -88,7 +100,15 @@
<td><input id="pct" type="text" tabindex="6"/></td>
<td>##%</td>
</tr>
+ <tr>
+ <td>Non-Input Element</td>
+ <td colspan="3">
+ <div class="test" id="_ViewTest">2485551212</div>
+ </td>
+ </tr>
</table>
<div id="info"></div>
+
+
</body>
</html>