<script language="javascript" type="text/javascript">
function validate() {
summary += isvalidFirstName();
summary += isvalidMobile();
summary += checkPassword();
summary += checkEmail();
if (summary != "") {
alert(summary);
return false;
} else
return true;
}
function isvalidFirstName() {
var uid;
var temp = document.getElementById("<%=txtFirstName.ClientID %>");
uid = temp.value;
if (uid == "") {
return ("Please enter firstname" + "\n");
} else
return "";
}
function isvalidMobile() {
var mob = /^[1-9]{1}[0-9]{9}$/;
var txtMob = document.getElementById(txtMobile);
if (mob.test(txtMob.value) == false) {
alert("Please enter valid mobile number");
txtMob.focus();
return false;
} else
return true;
}
function checkPassword(inputtxt) {
var pass = /^[A-Za-z]\w{7,14}$/;
if (inputtxt.value.match(pass)) {
alert("Password is correct");
return true;
} else {
alert("Wrong...!");
return false;
}
}
function checkEmail(inputtxt) {
var mail = /^\w+([\.-]?\w+)*#\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if (inputtxt.value.match(mail)) {
return true;
} else {
alert("Please enetr a valid email id");
return false;
}
}
</script>
I have added the above javascript code inside an .ASPX page and called the function validate on button click but it is not working. Can anyone help me?
Related
this is my email address validation using JavaScript, I have only two conditions that work, the one with the special character is not working.
Only the third is tested on the email address, the first two are on the password.
Please help me.
<script type = "text/javascript">
function validateEmail(form) {
var tr = /[A-Za-z0-9]{8,}/
var tr2 = /\S+#\S+\.\S+/
var tr3 = /[A-Za-z0-9]+[a-zA-Z0-9.!$+/?_]/
if (!(tr.test(form.password.value))){
alert("The passowrd length must be more than 8 letters.")
return false;
}
else if (!(tr3.test(form.password.value))){
alert("Enter a special character.")
return false;
}
else if (!(tr2.test(form.email.value))){
alert("Enter a valid email.")
return false;
}
else{
alert("signed in successfully")
window,open("HomePage.html")
return true
}
}
</script>
Just change regex to this.
const form = {
password: {
value: 'buffaloBill3##$',
},
email: {
value: 'hannibal#lecter.com'
}
};
function validateEmail(form) {
var tr = /[A-Za-z0-9]{8,}/
var tr2 = /\S+#\S+\.\S+/
var tr3 = /^(?=.*[!##$%^&*])[a-zA-Z0-9!##$%^&*]{0,}$/;
if (!(tr.test(form.password.value))) {
alert("The passowrd length must be more than 8 letters.")
return false;
} else if (!(tr3.test(form.password.value))) {
alert("Enter a special character.")
return false;
} else if (!(tr2.test(form.email.value))) {
alert("Enter a valid email.")
return false;
} else {
alert("signed in successfully")
window, open("HomePage.html")
return true
}
}
validateEmail(form);
I have written a Jquery code for validation. But the problem here is that, First the regular expression message fires and after that requiredField error message fires.
Here is my code:-
var ErrArr = [];
$(document).ready(function () {
$('#btnSave').click(function (e) {
e.preventDefault();
validateTextBoxes();
function FunValidatePan()
if (ErrArr.length > 0)
{
alert(ErrArr.join("\n"));
ErrArr = [];
return false;
}
});
function validateTextBoxes() {
if ($("#txtPanNo").val() === "") {
ErrArr.push('Pan No is required');
}
}
function FunValidatePan() {
var StrPriError = "";
if (Trim(document.getElementById("txtPanNo").value) != "" && Trim(document.getElementById("txtPanNo").value) != "NULL") {
var fil = /^[a-zA-Z0-9]+$/;
if (fil.test(document.getElementById("txtPanNo").value)) {
var abc = Trim(document.getElementById("txtPanNo").value);
if (abc.length != 10) {
StrPriError += ' Enter valid PAN Card\n';
}
}
else {
StrPriError += ' Enter valid PAN Card\n';
}
}
if (StrPriError != "") {
alert(StrPriError);
return false;
}
else {
return true;
}
}
I want that in single message. How to achieve that. Please suggest. Also I want that in Jquery
UPDATE
ASPX
<asp:TextBox ID="txtPanNo" runat="server" Width="100" MaxLength="10"></asp:TextBox>
Please check changes in the above code.
var ErrArr = [];
$(document).ready(function () {
$('#btnSave').click(function (e) {
e.preventDefault();
validateTextBoxes();
FunValidatePan();
if (ErrArr.length > 0)
{
alert(ErrArr.join("\n"));
ErrArr = [];
return false;
}
});
function validateTextBoxes() {
if ($("#txtPanNo").val() === "") {
ErrArr.push('Pan No is required');
}
}
function FunValidatePan() {
if (Trim(document.getElementById("txtPanNo").value) != "" && Trim(document.getElementById("txtPanNo").value) != "NULL") {
var fil = /^[a-zA-Z0-9]+$/;
if (fil.test(document.getElementById("txtPanNo").value)) {
var abc = Trim(document.getElementById("txtPanNo").value);
if (abc.length != 10) {
ErrArr.push('Enter valid PAN Card');
}
}
else {
ErrArr.push('Enter valid PAN Card');
}
}
}
I am using 3 javascript functions for textfield validation,
validate all the fields once all the fields are properly entered
yes/cancel confirmation should be also along with a
pop up window with the textfilled values which are display in a pageto verify entered values are correct
Once i select yes my button click event should occur if no is selected nothing sholud happen. pop up window can be closed by the user
Here is my js script,
I am getting all my textfields validated and getting confirmation box yes/cancel but popup window page is not displaying
<script type="text/javascript">
function UserDetailsConfirmation() {
return confirm("Are you sure you want to add this ?");
return openwin();
}
function openwin() {
window.open('PopupForConfirm.aspx?name1=' + name + '&age1=' + age + '&gen=' + gender + '', 'open_window', ' width=640, height=480, left=0, top=0');
}
function validate() {
var name= document.getElementById('<%=this.txtname.ClientID %>');
var age= document.getElementById('<%=this.txtage.ClientID %>');
var gender= document.getElementById('<%=this.txtgender.ClientID %>');
if (name.value) == "") {
alert("Please Enter Name");
name.focus();
return false;
}
else if (age.value) == "") {
alert("Please Enter age");
age.focus();
return false;
}
else if (gender.value) == "") {
alert("Please enter gender");
gender.focus();
return false;
}
else if (!UserDetailsConfirmation()) {
return false;
}
else {
return true;
}
}
</script>
You return right before you call openwin. How could it be reached? How about:
function UserDetailsConfirmation() {
return confirm("Are you sure you want to add this ?") && openwin();
}
BTW:
if (!UserDetailsConfirmation()) {
return false;
}
else {
return true;
}
boils down to:
return UserDetailsConfirmation();
<script type="text/javascript">
function UserDetailsConfirmation() {
var r = confirm("Are you sure you want to add this ?");
if (r == true) {
openwin();
} else {
return false;
}
}
function openwin() {
window.open('PopupForConfirm.aspx?name1=' + name + '&age1=' + age + '&gen=' + gender + '', 'open_window', ' width=640, height=480, left=0, top=0');
}
function validate() {
var name= document.getElementById('<%=this.txtname.ClientID %>');
var age= document.getElementById('<%=this.txtage.ClientID %>');
var gender= document.getElementById('<%=this.txtgender.ClientID %>');
if (name.value) == "") {
alert("Please Enter Name");
name.focus();
return false;
}
else if (age.value) == "") {
alert("Please Enter age");
age.focus();
return false;
}
else if (gender.value) == "") {
alert("Please enter gender");
gender.focus();
return false;
}
else if (!UserDetailsConfirmation()) {
return false;
}
else {
return true;
}
}
</script>
I have changed your code a bit ... While opening a popup return is not needed
I think this is enough to work
Try this on your onclick, call UserDetailsConfirmation:
<script type="text/javascript">
function UserDetailsConfirmation() {
if(validate() == true)
{
var r = confirm("Are you sure you want to add this ?");
if (r == true) {
openwin();
}
} else {
alert('Something went wrong');
}
}
function openwin() {
window.open('PopupForConfirm.aspx?name1=' + name + '&age1=' + age + '&gen=' + gender + '', 'open_window', ' width=640, height=480, left=0, top=0');
}
function validate() {
var name= document.getElementById('<%=this.txtname.ClientID %>');
var age= document.getElementById('<%=this.txtage.ClientID %>');
var gender= document.getElementById('<%=this.txtgender.ClientID %>');
if (name.value) == "") {
alert("Please Enter Name");
name.focus();
return false;
}
else if (age.value) == "") {
alert("Please Enter age");
age.focus();
return false;
}
else if (gender.value) == "") {
alert("Please enter gender");
gender.focus();
return false;
}
else{
return true;
}
}
</script>
Edited Option 2
This is actually based on your code..
<script type="text/javascript">
function UserDetailsConfirmation() {
return confirm("Are you sure you want to add this ?");
}
function openwin() {
window.open('PopupForConfirm.aspx?name1=' + name + '&age1=' + age + '&gen=' + gender + '', 'open_window', ' width=640, height=480, left=0, top=0');
}
function validate() {
var name= document.getElementById('<%=this.txtname.ClientID %>');
var age= document.getElementById('<%=this.txtage.ClientID %>');
var gender= document.getElementById('<%=this.txtgender.ClientID %>');
if (name.value) == "") {
alert("Please Enter Name");
name.focus();
return false;
}
else if (age.value) == "") {
alert("Please Enter age");
age.focus();
return false;
}
else if (gender.value) == "") {
alert("Please enter gender");
gender.focus();
return false;
}
else if (UserDetailsConfirmation() == true) {
openwin();
}
else{
return false;
}
}
</script>
when I click submit button it shows the validation right but after that alert message the page is being refreshed and i loos all other datas from the fields :S, how can i make it to still remain the others field filled.
I tried to remove the window.location.reload() after submit event is called but still not working :S. ANYONE any suggestion?
this is the code:
function formValidation() {
var uid = document.registration.userid;
var passid = document.registration.passid;
var uname = document.registration.username;
var uadd = document.registration.address;
var ucountry = document.registration.country;
var uzip = document.registration.zip;
var uemail = document.registration.email;
var umsex = document.registration.msex;
var ufsex = document.registration.fsex;
if (userid_validation(uid, 5, 12)) {
if (passid_validation(passid, 7, 12)) {
if (allLetter(uname)) {
if (alphanumeric(uadd)) {
if (countryselect(ucountry)) {
if (allnumeric(uzip)) {
if (ValidateEmail(uemail)) {
if (validsex(umsex, ufsex)) {}
}
}
}
}
}
}
}
return false;
}
function userid_validation(uid, mx, my) {
var uid_len = uid.value.length;
if (uid_len == 0 || uid_len >= my || uid_len < mx) {
alert("User Id should not be empty / length be between " + mx + " to " + my);
uid.focus();
return false;
}
return true;
}
function passid_validation(passid, mx, my) {
var passid_len = passid.value.length;
if (passid_len == 0 || passid_len >= my || passid_len < mx) {
alert("Password should not be empty / length be between " + mx + " to " + my);
passid.focus();
return false;
}
return true;
}
function allLetter(uname) {
var letters = /^[A-Za-z]+$/;
if (uname.value.match(letters)) {
return true;
} else {
alert('Username must have alphabet characters only');
uname.focus();
return false;
}
}
function alphanumeric(uadd) {
var letters = /^[0-9a-zA-Z]+$/;
if (uadd.value.match(letters)) {
return true;
} else {
alert('User address must have alphanumeric characters only');
uadd.focus();
return false;
}
}
function countryselect(ucountry) {
if (ucountry.value == "Default") {
alert('Select your country from the list');
ucountry.focus();
return false;
} else {
return true;
}
}
function allnumeric(uzip) {
var numbers = /^[0-9]+$/;
if (uzip.value.match(numbers)) {
return true;
} else {
alert('ZIP code must have numeric characters only');
uzip.focus();
return false;
}
}
function ValidateEmail(uemail) {
var mailformat = /^\w+([\.-]?\w+)*#\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if (uemail.value.match(mailformat)) {
return true;
} else {
alert("You have entered an invalid email address!");
uemail.focus();
return false;
}
}
function validsex(umsex, ufsex) {
x = 0;
if (umsex.checked) {
x++;
}
if (ufsex.checked) {
x++;
}
if (x == 0) {
alert('Select Male/Female');
umsex.focus();
return false;
} else {
alert('Form Succesfully Submitted');
window.location.reload()
return true;
}
}
Two problems...
Missing return
onSubmit="return formValidation();"
Missing return true;
if (validsex(umsex, ufsex)) { return true; }
This is part of an assignment. Everything that's supposed to work, already works, but there's something that bothers me. The only purpose of the code so far is to test our ability to validate from data. Anyway, right now the validate() function is attached to a submit button:
<input type="submit" value="Find Love" onclick="validate()">
When any validation fails, all the text boxes, drop downs, etc. are cleared, but I want them to retain their values and just focus on the first incorrect value (retaining their values is more important to me at this point). The actual Does that require some modification of the onclick function or a different function all together? Please help. If you need to see the javascript I can post that as well.
function validate()
{
var blnValid = true;
if(isBlank("txtFName"))
{
blnValid = false;
alert("First name cannot be blank!")
document.getElementById("txtFName").focus();
}
if(blnValid)
{
if(isBlank("txtLName"))
{
blnValid = false;
alert("Last name cannot be blank!")
document.getElementById("txtLName").focus();
}
}
if(blnValid)
{
if(isBlank("txtAge"))
{
blnValid = false;
alert("Age cannot be blank!")
document.getElementById("txtAge").focus();
}
}
if(blnValid)
{
var strInput = document.getElementById("txtAge").value;
if(!isInt(strInput))
{
blnValid = false;
alert("You must enter a valid number in the age field.")
document.getElementById("txtAge").select();
}
}
if(blnValid)
{
if(document.getElementById("selUserGender").selectedIndex <= 0)
{
alert("Please select your gender");
blnValid = false;
}
}
if(blnValid)
{
if(document.getElementById("selFindGender").selectedIndex <= 0)
{
alert("Please select your gender");
blnValid = false;
}
}
if(blnValid)
{
blnChecked = false;
arRadio = document.forms[0].rdbAgeRange;
for (var i = 0; i < arRadio.length; i++)
{
if(arRadio[i].checked)
{
blnChecked = true;
break;
}
}
if (!blnChecked)
{
alert("You must select an age group.");
blnValid = false;
}
}
if(blnValid)
{
if(!document.getElementById("chkSkeeball").checked
&& !document.getElementById("chkAir").checked
&& !document.getElementById("chkCliff").checked
&& !document.getElementById("chkHamster").checked)
{
blnValid = false;
alert("You must select a hobby.")
}
}
return blnValid;
}
function isInt(strValue)
{
var validNums = "0123456789";
var blnIsNumber = true;
var tempChar;
for (var i = 0; i < validNums.length; i++)
{
tempChar = strValue.substr(i, 1);
if (validNums.indexOf(tempChar) == -1)
{
return false;
}
}
return true;
}
function isBlank(elementID)
{
if(document.getElementById(elementID).value.length == 0)
{
return true;
}
return false;
}
Your problem is actually your HTML. Nothing in your Javascript is going to clear the elements but because you're using onClick the form is actually submitting anyway. I assume that it probably just submits back to the page and clears everything. Instead of onClick use onSubmit in the form element:
<form method="post" action="url_of_action" onSubmit="return validate()">
If it's not valid it will prevent the form from submitting.
Missing semi-colons:
if(isBlank("txtFName"))
{
blnValid = false;
alert("First name cannot be blank!") //here
document.getElementById("txtFName").focus();
}
if(blnValid)
{
if(isBlank("txtLName"))
{
blnValid = false;
alert("Last name cannot be blank!") //and here
document.getElementById("txtLName").focus();
}
}
if(blnValid)
{
if(isBlank("txtAge"))
{
blnValid = false;
alert("Age cannot be blank!") //and here
document.getElementById("txtAge").focus();
}
}