I have written same javascript twice for two textboxes but it runs both the scripts for one text box i need to write once and call the same for more text boxes
function checkalphabets() {
var pattern = /^[a-zA-Z\s]+$/;
if (!pattern.test(myTextBox.value)) {
modal({
type: 'warning',
title: 'Warning',
text: 'Only Alphabets allowed!',
center: false,
callback: function(){ $("#myTextBox").focus();}
});
exit;
return false;
}
return true;
}
function checkalphabets1() {
var pattern = /^[a-zA-Z\s]+$/;
if (!pattern.test(TextBox1.value)) {
modal({
type: 'warning',
title: 'Warning',
text: 'Only Alphabets allowed!',
center: false,
callback: function(){ $("#TextBox1").focus();}
});
exit;
return false;
}
return true;
}
$('.modal-btn').click(function() {
$('#modal-window').hide();
});
here is the fiddle
You can pass the element to be checked as a parameter of the function:
function checkalphabets($el) {
var pattern = /^[a-zA-Z\s]+$/;
if (!pattern.test($el.val())) {
modal({
type: 'warning',
title: 'Warning',
text: 'Only Alphabets allowed!',
center: false,
callback: function(){ $el.focus();}
});
return false;
}
return true;
}
The elements is passed when called and the check is done on the element.
checkalphabets($("#TextBox1"));
in your code textbox1 and mytextbox are undefined. Pass elements to the function to make them defined:
function checkalphabets(myinput) {
var pattern = /^[a-zA-Z\s]+$/;
if (!pattern.test(myinput.value)) {
modal({
type: 'warning',
title: 'Warning',
text: 'Only Alphabets allowed!',
center: false,
callback: function(){ $(myinput).focus();}
});
exit;
return false;
}
return true;
}
$('.modal-btn').click(function() {
$('#modal-window').hide();
});
also I suggest onkeyup instead of onblur to make check after each character:
<input name="myTextBox" type="text" id="myTextBox" onkeyup="checkalphabets(this)" />
<input name="TextBox1" type="text" id="TextBox1" onkeyup="checkalphabets(this)" />
Aslo it would be good idea to subtract disallowed characters after warning.
Can you think of passing the this value as input to the function in Javascript & extract the value from this variable as explained below?
HTML:
<form method="post" action="test.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJODIwMTY2MjU3ZGQVs14nJwqB/iIms8CsXW3SCzs22w==" />
</div>
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" value="75BBA7D6" />
</div>
<div>
<input name="myTextBox" type="text" id="myTextBox" onblur="checkalphabets(this)" />
<input name="TextBox1" type="text" id="TextBox1" onblur="checkalphabets(this)" />
</div>
</form>
Javascript:
function checkalphabets(thisValue) {
var pattern = /^[a-zA-Z\s]+$/;
if (!pattern.test(thisValue.value)) {
modal({
type: 'warning',
title: 'Warning',
text: 'Only Alphabets allowed t1 & t2!',
center: false,
callback: function(){ $(thisValue).focus();}
});
exit;
return false;
}
return true;
}
$('.modal-btn').click(function() {
$('#modal-window').hide();
});
Like wise you can use the same method of any number of text boxes!
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.