c# - JQuery MVC - Masked Textbox that accepts both letters and numbers -


so, have regular textbox can't seem find mask accepts alphanumeric values.

html:

<div class="form-group">                        <div class="col-md-6">         <label class="control-label">security code:</label>               @html.textbox("txtseccode", null, new { @class = "form-control", maxlength = 20 })     </div>                     </div> 

javascript: (btw i'm using razer engine view)

<script type="text/javascript">     $(function () {         $('#txtseccode').keyup(function () {             // used not let user input special characters.             if (this.value.match(/[^a-za-z0-9 ]/g)) {                 this.value = this.value.replace(/[^a-za-z0-9 ]/g, '');             }         });          // 'blur' function used auto-mask field when it's not focused         $('#txtseccode').blur(function () {             // that's mask, @ first field's maxlength set              // 16, errors occured , realized              // dots(.) of mask guilt this.             $('#txtseccode').mask('9999.9999.9999.9999');          });                                                          }); </script> 

anyway, mask should accept values like: '98ac.981x.b8tz.ew89'. if knows textbox field mask allows me enter alphanumeric values, please let me know.

thanks in advance :d

this regular expression match numbers, letters, , ..

[a-za-z0-9.] 

as far general approach though, think accomplish same thing more concisely doing html5 validation. pattern attribute can specify regex right on input element this:

<input required pattern="[a-za-z0-9.]+"> 

i see you're using mvc helper in razor create elements...i believe can change 4th line , take out js:

@html.textbox("txtseccode", null, new { @class = "form-control", maxlength = 20,  required = "required", pattern = "[a-za-z0-9.]+"}) 

it doesn't matter set required to, set make sure property gets included.


Comments

Popular posts from this blog

php - Wordpress website dashboard page or post editor content is not showing but front end data is showing properly -

javascript - Get parameter of GET request -

javascript - Twitter Bootstrap - how to add some more margin between tooltip popup and element -