Radio button validation causing rest of validation to fail - javascript

The radio validation works but then the rest don't. What have I done wrong?
function validateRadio(radios) {
for (i = 0; i < radios.length; ++i) {
if (radios[i].checked) return true;
}
return false;
}
function validateForm() {
if (validateRadio(document.forms["pancettaForm"]["updateShip"])) {
return true;
} else {
alert("Please tell us how you would like to update your order.");
return false;
}
}
var x = document.forms["pancettaForm"]["order-number"].value;
if (x == null || x == "") {
alert("Please provide your order number.");
return false;
}
var x = document.forms["pancettaForm"]["full-name"].value;
if (x == null || x == "") {
alert("Please provide your full name, or the recipients name if you are updating shipping information.");
return false;
}
var x = document.forms["pancettaForm"]["phone"].value;
if (x == null || x == "") {
alert("Please provide a phone number in case of delivery questions.");
return false;
}
var display = document.getElementById('address').style.display;
if (display == 'block') {
var x = document.forms["pancettaForm"]["address"].value;
if (x == null || x == "") {
alert("Please provide your address.");
return false;
}
}
var display = document.getElementById('city').style.display;
if (display == 'block') {
var x = document.forms["pancettaForm"]["city"].value;
if (x == null || x == "") {
alert("Please provide your city.");
return false;
}
}
var display = document.getElementById('state').style.display;
if (display == 'block') {
if (document.pancettaForm.state.value == "- Select State -") {
alert("Please provide your state.");
return false;
}
}
var display = document.getElementById('zip').style.display;
if (display == 'block') {
var x = document.forms["pancettaForm"]["zip"].value;
if (x == null || x == "") {
alert("Please provide your zip code.");
return false;
}
}
var display = document.getElementById('newShipDate').style.display;
if (display == 'block') {
if (document.pancettaForm.state.value == "- Select Date -") {
alert("Please choose your new shipping date.");
return false;
}
}

Just reverse the test so you do not have to return
if(!validateRadio (document.forms["pancettaForm"]["updateShip"]))
{
alert("Please tell us how you would like to update your order.");
return false;
}
// continue
You had the end bracket after the test of the radios so the rest of the script just floated in cyberspace
Also return true only once at the end and do not have var x multiple times and be consistent in how you access the form elements and I also fixed your date test which was testing state
function validateForm() {
var x,display,form = document.forms["pancettaForm"];
if (!validateRadio(form["updateShip"])) {
alert("Please tell us how you would like to update your order.");
return false;
}
x = form["order-number"].value;
if (x == null || x == "") {
alert("Please provide your order number.");
return false;
}
x = form["full-name"].value;
if (x == null || x == "") {
alert("Please provide your full name, or the recipients name if you are updating shipping information.");
return false;
}
x = form["phone"].value;
if (x == null || x == "") {
alert("Please provide a phone number in case of delivery questions.");
return false;
}
display = form["address"].style.display;
if (display == 'block') {
x = form["address"].value;
if (x == null || x == "") {
alert("Please provide your address.");
return false;
}
}
display = form["city"].style.display;
if (display == 'block') {
x = form["city"].value;
if (x == null || x == "") {
alert("Please provide your city.");
return false;
}
}
display = form['state'].style.display;
if (display == 'block') {
x = form['state'].value;
if (x == "- Select State -") {
alert("Please provide your state.");
return false;
}
}
display = form['zip'].style.display;
if (display == 'block') {
x = form["zip"].value;
if (x == null || x == "") {
alert("Please provide your zip code.");
return false;
}
}
display = form["newShipDate"].style.display;
if (display == 'block') {
x = form["newShipDate"].value;
if (x.value == "- Select Date -") {
alert("Please choose your new shipping date.");
return false;
}
}
return true;
}

Related

How do I correctly perform form validation in JavaScript?

I am having a hard time trying to do a correct form validation. I have Name, Email, and Phone Number fields. I implemented the validation check for all of them and when I click on the submit query, it returns email as false, but not anything else. It also will still submit the form. How do I fix this?
JSFiddle: http://jsfiddle.net/GVQpL/
JavaScript Code:
function validateForm(/*fullName, email, phoneNumber*/)
{
//-------------------------NAME VALIDATION-----------------------------//
var fullNameV = document.forms["queryForm"]["fullName"].value;
if (fullNameV == null || fullNameV == "")
{
alert("Name must be filled out!");
return false;
}
else if(fullNameV.indexOf(" ") <= fullNameV.length)
{
alert("Not a valid name");
return false;
}
//-------------------------EMAIL VALIDATION-----------------------------//
var emailV = document.forms["queryForm"]["email"].value;
if (emailV == null || emailV == "")
{
alert("Email must be filled out!");
return false;
}
var atpos = emailV.indexOf("#");
var dotpos = emailV.lastIndexOf(".");
if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= x.length)
{
alert("Not a valid e-mail address");
return false;
}
//-------------------------PHONE # VALIDATION-----------------------------//
var phoneNumberV = document.forms["queryForm"]["phoneNumber"].value;
if (phoneNumberV == null || phoneNumberV == "")
{
alert("Phone Number must be filled out!");
return false;
}
var error = "";
var stripped = phoneNumberV.replace(/[\(\)\.\-\ ]/g, '');
if (phoneNumberV == "")
{
error = alert("You didn't enter a phone number.\n");
phoneNumberV.style.background = 'Yellow';
}
else if (isNaN(parseInt(stripped)))
{
error = alert("The phone number contains illegal characters.\n");
phoneNumberV.style.background = 'Yellow';
}
else if (!(stripped.length == 10))
{
error = alert("The phone number is the wrong length. Make sure you included an area code.\n");
phoneNumberV.style.background = 'Yellow';
}
return error;
}
Update your fiddle's html for the function to be called onsubmit="return validateForm()" and removed the required="required" changed your function to work, you can see it here:
http://jsfiddle.net/GVQpL/3/
function validateForm(/*fullName, email, phoneNumber*/)
{
//-------------------------NAME VALIDATION-----------------------------//
var fullNameV = document.forms["queryForm"]["fullName"].value;
if (fullNameV == null || fullNameV == "")
{
alert("Name must be filled out!");
document.forms["queryForm"]["fullName"].focus();
return false;
}
else if(fullNameV.indexOf(" ") >= fullNameV.length)
{
alert("Not a valid name");
document.forms["queryForm"]["fullName"].focus();
return false;
}
//-------------------------EMAIL VALIDATION-----------------------------//
var emailV = document.forms["queryForm"]["email"].value;
if (emailV == null || emailV == "")
{
alert("Email must be filled out!");
document.forms["queryForm"]["email"].focus();
return false;
}
var emailReg = /^([\w-\.]+#([\w-]+\.)+[\w-]{2,4})?$/;
if(!emailReg.test(emailV)){
alert("Not a valid e-mail address");
document.forms["queryForm"]["email"].focus();
return false;
}
//-------------------------PHONE # VALIDATION-----------------------------//
var phoneNumberV = document.forms["queryForm"]["phoneNumber"].value;
if (phoneNumberV == null || phoneNumberV == "")
{
alert("Phone Number must be filled out!");
document.forms["queryForm"]["phoneNumber"].focus();
return false;
}
var error = "";
var stripped = phoneNumberV.replace(/[\(\)\.\-\ ]/g, '');
if (phoneNumberV == "")
{
alert("You didn't enter a phone number.\n");
document.forms["queryForm"]["phoneNumber"].focus()
document.forms["queryForm"]["phoneNumber"].style.background = 'Yellow';
return false;
}
else if (isNaN(parseInt(stripped)))
{
alert("The phone number contains illegal characters.\n");
document.forms["queryForm"]["phoneNumber"].focus();
document.forms["queryForm"]["phoneNumber"].style.background = 'Yellow';
return false;
}
else if (!(stripped.length == 10))
{
alert("The phone number is the wrong length. Make sure you included an area code.\n");
document.forms["queryForm"]["phoneNumber"].focus();
document.forms["queryForm"]["phoneNumber"].style.background = 'Yellow';
return false;
}
if(!confirm('Are you sure you want to submit your DSLR query?')){
return false;
}
return true;
}

How to check if the selected value of drop-down is set to No and Text-Box is blank using JavaScript

I have drop-down and text-box in a gridview and I am trying to check if the selected value of a drop-down is set to "No" and no comments is entered in the text-box then i want to show message. The requirement should be as long as the selected value of the drop down is set to No then comments must be entered in the text-box. My issue is that i am getting the message even if the drop-down is set to Yes or comments is provided when the drop down is set to No. Here is the code:
function validate() {
var flag = false;
var gridView = document.getElementById('<%= GridView1.ClientID %>');
for (var i = 1; i < gridView.rows.length; i++) {
var ddl = gridView.rows[i].getElementsByTagName('Select');
var areas = gridView.rows[i].getElementsByTagName('textarea');
if (ddl != null && ddl.length > 1 && ddl[0] != null && areas != null && areas.length > 1 && areas[0] != null) {
if (areas[0].type == "textarea" && ddl[0].type == "select-one") {
var txtval = areas[0].value;
var txtddl = ddl[0].value;
if (txtddl.value == "No" && (txtval == "" || txtval == null)) {
flag = false;
break;
}
else {
flag = true
}
}
}
}
if (!flag) {
alert('Please note that comments is required if drop down is set to No. Thanks');
areas[i].focus();
}
return flag;
}
</script>
You can do like this:
<script>
function validate() {
var flag = false;
var gridView = document.getElementById('<%= GridView1.ClientID %>');
for (var i = 1; i < gridView.rows.length; i++) {
var selects = gridView.rows[i].getElementsByTagName('select');
//var inputs = gridView.rows[i].getElementsByTagName('input');
var areas = gridView.rows[i].getElementsByTagName('textarea');
if (selects != null && areas != null) {
if (areas[0].type == "textarea") {
var txtval = areas[0].value;
var selectval = selects[0].value;
if (selectval == "No" && (txtval == "" || txtval == null)) {
flag = false;
break;
}
else {
flag = true;
}
}
}
}
if (!flag) {
alert('Please enter comments. Thanks');
}
return flag;
}
</script>
Try this:
$('#select').on('change', function () {
var text = $(this).find(":selected").text();
var textBox = $(this).parent().filter('input [name="InputName"]');
if(text == "no" && textBox.val() =="")
{
\\display your message
}
});

SCRIPT5007: Unable to get property 'value' of undefined or null reference only in IE9 only

I only receive this error in Internet Explorer 9. IE8 and IE10 run the script fine. when click on the Submit button then i am getting this error
SCRIPT5007: Unable to get property 'value' of undefined or null reference CNSIControlServlet, line 15364 character 3
function checkForPhysicianInfo(){
var visibleRenderingPhyInfoValue = (document.frmSubmitInstClaim.elements['fhdn&BillingRendering']).value;
var visibleOperatePhyInfoValue = (document.frmSubmitInstClaim.elements['fhdn&isOperatePhyInfoVisible']).value;
var visibleOtherOperatingPhyInfoValue = (document.frmSubmitInstClaim.elements['fhdn&isOtherOperatingPhyInfoVisible']).value;
var visibleReferringPhyInfoValue = (document.frmSubmitInstClaim.elements['fhdn&isReferringPhyInfoVisible']).value;
var formName1='frmSubmitInstClaim';
var formElement = document.forms[formName1];
var l_sRenderingProviderID = document.frmSubmitInstClaim.elements['nfld_a&db|IG_CLAIM_HEADER-SRVCNG_PRVDR_LCTN_IDENTIFIER'];
var selectRenderingProviderIDType = formElement.elements['ncmb&db|IG_CLAIM_HEADER-SRVCNG_PRVDR_IDNTFR_TYPE_CID'];
RenderingProviderIDType = selectRenderingProviderIDType.options[selectRenderingProviderIDType.selectedIndex].value ;
var l_sOperateProviderID =document.frmSubmitInstClaim.elements['nfld_a&db|IG_CLAIM_HEADER-OP_PRVDR_IDNTFR'];
var selectOperateProviderIDType = formElement.elements['ncmb&db|IG_CLAIM_HEADER-OP_PRVDR_IDNTFR_TYPE_CID'];
OperateProviderIDType = selectOperateProviderIDType.options[selectOperateProviderIDType.selectedIndex].value ;
var l_sOtherOperatingProviderID =document.frmSubmitInstClaim.elements['nfld_a&db|IG_CLAIM_HEADER-OT_PRVDR_IDNTFR'];
var selectOtherOperatingProviderIDType = formElement.elements['ncmb&db|IG_CLAIM_HEADER-OT_PRVDR_IDNTFR_TYPE_CID'];
OtherOperatingProviderIDType = selectOtherOperatingProviderIDType.options[selectOtherOperatingProviderIDType.selectedIndex].value ;
var l_sReferringProviderID =document.frmSubmitInstClaim.elements['nfld_a&db|IG_CLAIM_HEADER-RF_LCTN_IDENTIFIER'];
var selectReferringProviderIDType = formElement.elements['ncmb&db|IG_CLAIM_HEADER-RF_IDNTFR_TYPE_CID'];
ReferringProviderIDType = selectReferringProviderIDType.options[selectReferringProviderIDType.selectedIndex].value ;
if("Yes" == visibleRenderingPhyInfoValue)
{
if(Trim(l_sRenderingProviderID.value) == "" )
{
alert("Please Enter Rendering Physican Provider ID ");
l_sRenderingProviderID.focus();
return false;
}
if(Trim(RenderingProviderIDType) == "-2" )
{
alert("Please Enter Rendering Physican Provider ID Type");
selectRenderingProviderIDType.focus();
return false;
}
//MIPRO00050010
if((Trim(RenderingProviderIDType) == "3") && (Trim(l_sRenderingProviderID.value)!= "" )
&& (!IsNumeric(l_sRenderingProviderID.value)))
{
alert("Please enter valid number in Provider ID.");
l_sRenderingProviderID.focus();
return false;
}
if((Trim(RenderingProviderIDType) == "3") && (Trim(l_sRenderingProviderID.value).length < "10") )
{
alert("NPI must be 10 digits.");
l_sRenderingProviderID.focus();
return false;
}
//MIPRO00050010
}//Rendering
if("Yes" == visibleOperatePhyInfoValue)
{
if(Trim(l_sOperateProviderID.value) == "")
{
alert("Please Enter Operating Provider ID");
l_sOperateProviderID.focus();
return false;
}
if(Trim(OperateProviderIDType) == "-2" )
{
alert("Please Enter Operating Provider ID Type");
selectOperateProviderIDType.focus();
return false;
}
//MIPRO00050010
if((Trim(OperateProviderIDType) == "3") && (Trim(l_sOperateProviderID.value)!= "" )
&& (!IsNumeric(l_sOperateProviderID.value)))
{
alert("Please enter valid number in Provider ID.");
l_sOperateProviderID.focus();
return false;
}
if((Trim(OperateProviderIDType) == "3") && (Trim(l_sOperateProviderID.value).length < "10") )
{
alert("NPI must be 10 digits.");
l_sOperateProviderID.focus();
return false;
}
//MIPRO00050010
}//Operating
if("Yes" == visibleOtherOperatingPhyInfoValue)
{
if(Trim(l_sOtherOperatingProviderID.value) == "" )
{
alert("Please Enter Other Operating Physician Provider ID");
l_sOtherOperatingProviderID.focus();
return false;
}
if(Trim(OtherOperatingProviderIDType) == "-2" )
{
alert("Please Enter Other Operating Physician Provider ID Type");
selectOtherOperatingProviderIDType.focus();
return false;
}
//MIPRO00050010
if((Trim(OtherOperatingProviderIDType) == "3") && (Trim(l_sOtherOperatingProviderID.value)!= "" )
&& (!IsNumeric(l_sOtherOperatingProviderID.value)))
{
alert("Please enter valid number in Provider ID.");
l_sOtherOperatingProviderID.focus();
return false;
}
if((Trim(OtherOperatingProviderIDType) == "3") && (Trim(l_sOtherOperatingProviderID.value).length < "10") )
{
alert("NPI must be 10 digits.");
l_sOtherOperatingProviderID.focus();
return false;
}
//MIPRO00050010
}//Other Operating
if("Yes" == visibleReferringPhyInfoValue)
{
if(Trim(l_sReferringProviderID.value) == "")
{
alert("Please Enter Referring Physician Provider ID");
l_sReferringProviderID.focus();
return false;
}
if(Trim(ReferringProviderIDType) == "-2" )
{
alert("Please Enter Referring Physician Provider ID Type");
selectReferringProviderIDType.focus();
return false;
}
//MIPRO00050010
if((Trim(ReferringProviderIDType) == "3") && (Trim(l_sReferringProviderID.value)!= "" )
&& (!IsNumeric(l_sReferringProviderID.value)))
{
alert("Please enter valid number in Provider ID.");
l_sReferringProviderID.focus();
return false;
}
if((Trim(ReferringProviderIDType) == "3") && (Trim(l_sReferringProviderID.value).length < "10") )
{
alert("NPI must be 10 digits.");
l_sReferringProviderID.focus();
return false;
}
//MIPRO00050010
}//Referring
return true;
}
</script>

Javascript alert on dropdown menus?

I have a javascript alert on my form here - http://investing.uglyopportunities.com/opportunity/ I have the javascript function working correctly for my form. Except I also want the javascript to alert when the user doesn't select from either of the two drop down menus. I really don't have much experience at all with javascript, so keep that in mind! Here is my current code. I really appreciate any help
<script type="text/javascript">// <![CDATA[
function validateForm() {
var a = document.forms["myform"]["inf_field_FirstName"].value;
var b = document.forms["myform"]["inf_field_Email"].value;
var c = document.forms["myform"]["inf_field_Phone1"].value;
var e = document.forms["myform"]["inf_field_City"].value;
var f = document.forms["myform"]["inf_field_State"].value;
var g = document.forms["myform"]["inf_field_PostalCode"].value;
if (a == null || a == "" || a == "First Name Here") {
alert("Please enter your First Name!");
return false;
}
if (c == null || c == '' || c == "Enter Your Phone Here" || c.length < 9) {
alert("Please insert your phone number!");
return false;
}
if (e == null || e == '' ||e == "City") {
alert("Please insert your city");
return false;
}
if (f == null || f == '' || f == "State") {
alert("Please insert your state ");
return false;
}
if (g == null || g == '' ||g == "Postal Code" || c.length < 5) {
alert("Please insert your postal code");
return false;
}
var emailRegEx = /^[A-Z0-9._%+-]+#[A-Z0-9.-]+\.[A-Z]{2,4}$/i;
if (document.myform.inf_field_Email.value.search(emailRegEx) == -1) {
alert("Please enter a valid email address.");
return false;
}
}
// ]]>
</script>
if(document.getElementById('inf_custom_LevelofInterest').value == '' || document.getElementById('inf_custom_Doyouhavemoneytoinvest').value == ''){
alert('please select ...');
return false;
}

Why is my form not validating on submit? [closed]

This question is unlikely to help any future visitors; it is only relevant to a small geographic area, a specific moment in time, or an extraordinarily narrow situation that is not generally applicable to the worldwide audience of the internet. For help making this question more broadly applicable, visit the help center.
Closed 10 years ago.
I have a sign up form on my page at http://business.uglyopportunities.com/affiliate-signup/ (scroll down to see the form)
Keep in mind, I am not very good with JS so this may be a simple error.
Anyways, here is the first line of my form telling it to validate:
<form accept-charset="UTF-8" action="xxxxx" class="infusion-form" method="POST" name="myform" onsubmit="return validateForm();">
and here is my validateForm javascript:
<script type="text/javascript">
function validateForm() {
var a = document.forms["myform"]["inf_field_FirstName"].value;
var b = document.forms["myform"]["inf_field_Email"].value;
var c = document.forms["myform"]["inf_field_Phone1"].value;
var d = document.forms["myform"][" inf_field_StreetAddress1"].value;
var e = document.forms["myform"][" inf_field_City"].value;
var f = document.forms["myform"][" inf_field_State"].value;
var g = document.forms["myform"][" inf_field_PostalCode"].value;
var h = document.forms["myform"][" inf_other_Username"].value;
var i = document.forms["myform"][" inf_other_Password"].value;
var j = document.forms["myform"][" inf_other_RetypePassword"].value;
if (a == null || a == "" || a == "First Name Here") {
alert("Please enter your First Name!");
return false;
}
if (c == null || c == '' || c == "Enter Your Phone Here" || c.length < 9) {
alert("Please insert your phone number!");
return false;
}
if (d == null || d == '' || d == "Street Address”) {
alert("Please insert your street address ");
return false;
}
if (e == null || e == '' ||e == "City”) {
alert("Please insert your city");
return false;
}
if (f == null || f == '' || f == "State”) {
alert("Please insert your state ");
return false;
}
if (g == null || g == '' ||g == "Postal Code”) {
alert("Please insert your postal code");
return false;
}
if (h == null || h == '' || h == "Username”) {
alert("Please insert your username ");
return false;
}
if (i == null || i == '' ||i == "password”) {
alert("Please insert your password");
return false;
}
if (j == null || j == '' || j == "password”) {
alert("Please re - type your password ! ");
return false;
}
var emailRegEx = /^[A-Z0-9._%+-]+#[A-Z0-9.-]+\.[A-Z]{2,4}$/i;
if (document.myform.inf_field_Email.value.search(emailRegEx) == -1) {
alert("Please enter a valid email address.");
return false;
}
}
</script>
and that is not working. However, when I used this code, it worked fine:
<script type="text/javascript">
function validateForm() {
var a=document.forms["myform"]["inf_field_FirstName"].value;
var b=document.forms["myform"]["inf_field_Email"].value;
var c=document.forms["myform"]["inf_field_Phone1"].value;
if (a==null || a=="" || a=="First Name Here") {
alert("Please enter your First Name!");
return false;
}
if (c==null || c==''|| c=="Enter Your Phone Here" || c.length < 9) {
alert("Please insert your phone number!");
return false;
}
var emailRegEx = /^[A-Z0-9._%+-]+#[A-Z0-9.-]+\.[A-Z]{2,4}$/i;
if (document.myform.inf_field_Email.value.search(emailRegEx) == -1) {
alert("Please enter a valid email address.");
return false;
}
}
</script>
UPDATED CODE *
<script type="text/javascript">// <![CDATA[
function validateForm() {
var a = document.forms["myform"]["inf_field_FirstName"].value;
var b = document.forms["myform"]["inf_field_Email"].value;
var c = document.forms["myform"]["inf_field_Phone1"].value;
var d = document.forms["myform"]["inf_field_StreetAddress1"].value;
var e = document.forms["myform"]["inf_field_City"].value;
var f = document.forms["myform"]["inf_field_State"].value;
var g = document.forms["myform"]["inf_field_PostalCode"].value;
var h = document.forms["myform"]["inf_other_Username"].value;
var i = document.forms["myform"]["inf_other_Password"].value;
var j = document.forms["myform"]["inf_other_RetypePassword"].value;
if (a == null || a == "" || a == "First Name Here") {
alert("Please enter your First Name!");
return false;
}
if (c == null || c == '' || c == "Enter Your Phone Here" || c.length < 9) {
alert("Please insert your phone number!");
return false;
}
if (d == null || d == '' || d == "Street Address") {
alert("Please insert your street address ");
return false;
}
if (e == null || e == '' ||e == "City") {
alert("Please insert your city");
return false;
}
if (f == null || f == '' || f == "State") {
alert("Please insert your state ");
return false;
}
if (g == null || g == '' ||g == "Postal Code") {
alert("Please insert your postal code");
return false;
}
if (h == null || h == '' || h == "Username") {
alert("Please insert your username ");
return false;
}
if (i == null || i == '' ||i == "password") {
alert("Please insert your password");
return false;
}
if (j == null || j == '' || j == "password") {
alert("Please re - type your password ! ");
return false;
}
var emailRegEx = /^[A-Z0-9._%+-]+#[A-Z0-9.-]+\.[A-Z]{2,4}$/i;
if (document.myform.inf_field_Email.value.search(emailRegEx) == -1) {
alert("Please enter a valid email address.");
return false;
}
}
// ]]>
</script>
You have a white space here:
var d = document.forms["myform"][" inf_field_StreetAddress1"].value;
// ^-----------------------
You have the same problem with for e,f,g,h,i,j
Also, you used the wrong quotes sign:
"Street Address”
// ^--------------
You did it several times.
As gdoron says, it's probably an spelling problem. You cannot begin the name of an element with a whitespace http://www.w3.org/TR/html401/types.html#type-name

Categories