Really Stuck - ASP/Javascript Form Validation

[Felipo]

Hi Folks -

I have been spending gays spinning my wheels on getting some form validation to work -

I have text boxes and radio buttons on the form -

The validaiton is written in Javascript

It is an ASP web page -

It seems that the Javascript validation code is just ignored - Very weird -

I use onsubmit and have used onclick - and the results are always the same, the validation code is not performed -

I use dreamweaver 8 (dreamweaver CS2) as my web authoring tool and use MS Access as my database right now -

In the method parameter of the form tag I have used the 2 different parameters - One parameter I used is the actual page name to go to when the validation is succesful - I have also used the MM_Edit parameter supplied by Dreamweaver in the method for th eform as well -

I will list my code - I hope somebody can see what I am not seeing and get me over this hurdle -

Thank You for reading and trying to help me -

<%@LANGUAGE="JAVASCRIPT" CODEPAGE="1252"%>
<!--#include file="Connections/ConnStudio.asp" -->
<%
// *** Edit Operations: declare variables

// set the form action variable
var MM_editAction = Request.ServerVariables("SCRIPT_NAME");
if (Request.QueryString) {
  MM_editAction += "?" + Server.HTMLEncode(Request.QueryString);
}

// boolean to abort record edit
var MM_abortEdit = false;

// query string to execute
var MM_editQuery = "";
%>
<%
// *** Insert Record: set variables

if (String(Request("MM_insert")) == "StudioReviewForm") {

  var MM_editConnection = MM_ConnStudio_STRING;
  var MM_editTable  = "Reviews";
  var MM_editRedirectUrl = "StudioReviewConfirmation.asp";
  var MM_fieldsStr = "SubmittedBy|value|HiddenStudioPhoneNumber|value|Courteous|value|Knowlegable|value|Affordable|value|Sanitary|value|GoodQualityWork|value|OverallRating|value|AdditionalComments1|value";
  var MM_columnsStr = "SubmittedBy|',none,''|StudioPhoneNumber|',none,''|CourteousService|none,1,0|KnowledgableStaff|none,1,0|AffordablePrices|none,1,0|GoodSanitaryConditions|none,1,0|GoodWorkQuality|none,1,0|OverallRating|',none,''|AdditionalComments1|',none,''";

  // create the MM_fields and MM_columns arrays
  var MM_fields = MM_fieldsStr.split("|");
  var MM_columns = MM_columnsStr.split("|");
  
  // set the form values
  for (var i=0; i+1 < MM_fields.length; i+=2) {
    MM_fields[i+1] = String(Request.Form(MM_fields[i]));
  }

  // append the query string to the redirect URL
  if (MM_editRedirectUrl && Request.QueryString && Request.QueryString.Count > 0) {
    MM_editRedirectUrl += ((MM_editRedirectUrl.indexOf('?') == -1)?"?":"&") + Request.QueryString;
  }
}
%>
<%
// *** Insert Record: construct a sql insert statement and execute it

if (String(Request("MM_insert")) != "undefined") {

  // create the sql insert statement
  var MM_tableValues = "", MM_dbValues = "";
  for (var i=0; i+1 < MM_fields.length; i+=2) {
    var formVal = MM_fields[i+1];
    var MM_typesArray = MM_columns[i+1].split(",");
    var delim =    (MM_typesArray[0] != "none") ? MM_typesArray[0] : "";
    var altVal =   (MM_typesArray[1] != "none") ? MM_typesArray[1] : "";
    var emptyVal = (MM_typesArray[2] != "none") ? MM_typesArray[2] : "";
    if (formVal == "" || formVal == "undefined") {
      formVal = emptyVal;
    } else {
      if (altVal != "") {
        formVal = altVal;
      } else if (delim == "'") { // escape quotes
        formVal = "'" + formVal.replace(/'/g,"''") + "'";
      } else {
        formVal = delim + formVal + delim;
      }
    }
    MM_tableValues += ((i != 0) ? "," : "") + MM_columns[i];
    MM_dbValues += ((i != 0) ? "," : "") + formVal;
  }
  MM_editQuery = "insert into " + MM_editTable + " (" + MM_tableValues + ") values (" + MM_dbValues + ")";

  if (!MM_abortEdit) {
    // execute the insert
    var MM_editCmd = Server.CreateObject('ADODB.Command');
    MM_editCmd.ActiveConnection = MM_editConnection;
    MM_editCmd.CommandText = MM_editQuery;
    MM_editCmd.Execute();
    MM_editCmd.ActiveConnection.Close();

    if (MM_editRedirectUrl) {
      Response.Redirect(MM_editRedirectUrl);
    }
  }

}
%>
<%
var rsStudioReviewed__MMColParam = "1";
if (String(Request.Form("ParamPhone")) != "undefined" && 
    String(Request.Form("ParamPhone")) != "") { 
  rsStudioReviewed__MMColParam = String(Request.Form("ParamPhone"));
}
%>
<%
var rsStudioReviewed = Server.CreateObject("ADODB.Recordset");
rsStudioReviewed.ActiveConnection = MM_ConnStudio_STRING;
rsStudioReviewed.Source = "SELECT StudioName, Address, City, State, ZipCode, StudioPhoneNumber FROM Studio WHERE StudioPhoneNumber = '"+ rsStudioReviewed__MMColParam.replace(/'/g, "''") + "'";
rsStudioReviewed.CursorType = 0;
rsStudioReviewed.CursorLocation = 2;
rsStudioReviewed.LockType = 1;
rsStudioReviewed.Open();
var rsStudioReviewed_numRows = 0;
%><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Submit A Studio Review Form</title>
<style type="text/css">
<!--
body {
	background-color: #351100;
}
.style1 {color: #FFFFFF}
.style4 {color: #CCCCCC; }
.style5 {color: #FFFF00; }
.style6 {color: #f5d781}
.style7 {color: #FF0000}
-->
</style>

<script type="text/javascript">

<!--

function validate_form ( )
{
        valid = true;

        if ( document.StudioReviewForm.SubmittedBy.value == "" )
        {
                alert ( "Please fill in the 'Submitted By' box." );
                valid = false;
        }

        if ( ( document.StudioReviewForm.Courteous[0].checked == false ) && ( document.StudioReviewForm.Courteous[1].checked == false ) )
        {
                alert ( "Please choose your answer to Question 1 by selecting Yes or No" );
                valid = false;
        }
		
        if ( ( document.StudioReviewForm.Knowledgable[0].checked == false ) && ( document.StudioReviewForm.Knowledgable[1].checked == false ) )
        {
                alert ( "Please choose your answer to Question 2 by selecting Yes or No" );
                valid = false;
        }
			
        if ( ( document.StudioReviewForm.Affordable[0].checked == false ) && ( document.StudioReviewForm.Affordable[1].checked == false ) )
        {
                alert ( "Please choose your answer to Question 3 by selecting Yes or No" );
                valid = false;
        }
			
        if ( ( document.StudioReviewForm.Sanitary[0].checked == false ) && ( document.StudioReviewForm.Sanitary[1].checked == false ) )
        {
                alert ( "Please choose your answer to Question 4 by selecting Yes or No" );
                valid = false;
        }
			
        if ( ( document.StudioReviewForm.GoodQualityWork[0].checked == false ) && ( document.StudioReviewForm.GoodQualityWork[1].checked == false ) )
        {
                alert ( "Please choose your answer to Question 5 by selecting Yes or No" );
                valid = false;
        }
		
	
        if ( document.StudioReviewForm.OverallRating.selectedIndex == 0 )
        {
                alert ( "Please select your Overall Rating." );
                valid = false;
        }

        if ( document.StudioReviewForm.AdditionalComments1.value == "" )
        {
                alert ( "Please provide additional comments in the comment area." );
                valid = false;
        }



        return valid;
}

//-->

</script>

<script type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>

<script>
function limitText(limitField, limitNum) {
    if (limitField.value.length > limitNum) {
        limitField.value = limitField.value.substring(0, limitNum);
    } 
}
</script>

</head>

<body onload="MM_preloadImages('Navigation Buttons/studioreviewsOver.jpg','Navigation Buttons/submitareviewOver.jpg','Navigation Buttons/HomeOver.jpg')">
<table width="750" border="0" align="center">
  <tr>
    <td colspan="3"><span class="style1"><img src="Images/BannerWIP.png" width="750" height="345" /></span></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td colspan="3"><table width="750" border="0">
      <tr>
        <td width="134" height="299"></td>
        <td width="468" bgcolor="#FFFFFF"><img src="WIP Graphics/TribalBordersTop.png" width="477" height="26" /><br />
            <table width="479" border="0">
              <tr>
                <td width="26"><img src="WIP Graphics/TribalBordersLeft3.png" width="26" height="239" /></td>
                <td width="413" valign="top" bgcolor="#000000"><p align="center" class="style5"><br />
                  Welcome To Our Studio Review Form </p>
                    <p align="center" class="style4"> Please Complete The Review Form Below<br />
                    Then Click The Submit Buton At The Bottom OF The Form <br />
                    To Add Your Reveiew To Our Database For:</p>
                    <table width="410" border="0">
                      <tr>
                        <td width="20">&nbsp;</td>
                        <td width="380"><span class="style7"><%=(rsStudioReviewed.Fields.Item("StudioName").Value)%><br />
                          <%=(rsStudioReviewed.Fields.Item("Address").Value)%></span><br />
                          <span class="style7"><%=(rsStudioReviewed.Fields.Item("City").Value)%>, <%=(rsStudioReviewed.Fields.Item("State").Value)%>, <%=(rsStudioReviewed.Fields.Item("ZipCode").Value)%></span><br />
                          <span class="style7"><%=(rsStudioReviewed.Fields.Item("StudioPhoneNumber").Value)%></span></td>
                      </tr>
                    </table>                  </td>
                <td width="26"><img src="WIP Graphics/TribalBordersRight3.png" width="26" height="239" /></td>
              </tr>
            </table>
          <img src="WIP Graphics/TribalBordersBottom.png" width="477" height="26" /></td>
        <td width="134"><a href="studioreviews.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('studioreviews','','Navigation Buttons/studioreviewsOver.jpg',1)"><img src="Navigation Buttons/studioreviewsUp.jpg" name="studioreviews" width="134" height="49" border="0" id="studioreviews" /><br />
          </a><a href="SubmitAStudioReview.asp" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('submitareview','','Navigation Buttons/submitareviewOver.jpg',1)"><img src="Navigation Buttons/submitareviewUp.jpg" name="submitareview" width="134" height="49" border="0" id="submitareview" /><br />
        </a><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Home','','Navigation Buttons/HomeOver.jpg',1)"><img src="Navigation Buttons/HomeUp.jpg" name="Home" width="134" height="49" border="0" id="Home" /></a></td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td height="21" colspan="3"><p>&nbsp;</p>
      <form action="<%=MM_editAction%>" METHOD="POST" name="StudioReviewForm" id="StudioReviewForm" onsubmit="return validate form ( );">
        <p>&nbsp;</p>
        <table width="750" border="0">
          <tr>
            <td width="418"><span class="style6">Submitted By: 
              <input name="SubmittedBy" type="text" id="SubmittedBy" size="50" maxlength="50" />
            </span></td>
            <td colspan="2"><input name="HiddenStudioPhoneNumber" type="hidden" id="HiddenStudioPhoneNumber" value="<%=(rsStudioReviewed.Fields.Item("StudioPhoneNumber").Value)%>" /></td>
          </tr>
          <tr>
            <td colspan="3">&nbsp;</td>
          </tr>
          <tr>
            <td><span class="style6">1.) Were The People You Dealt With Courteous? </span></td>
            <td width="159" class="style6"><input name="Courteous" type="radio" value="Yes" /> 
            Yes </td>
            <td width="159" class="style6"><input name="Courteous" type="radio" value="No" /> 
            No </td>
          </tr>
          <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td><span class="style6">2.) Was The Staff Knowledgable?</span></td>
            <td><span class="style6">
              <input name="Knowlegable" type="radio" value="Yes" />
Yes </span></td>
            <td><span class="style6">
              <input name="Knowlegable" type="radio" value="No" />
No </span></td>
          </tr>
          <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td><span class="style6">3.) Were The Prices Affordable?</span></td>
            <td><span class="style6">
              <input name="Affordable" type="radio" value="Yes" />
Yes </span></td>
            <td><span class="style6">
              <input name="Affordable" type="radio" value="No" />
              No
            </span></td>
          </tr>
          <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td><span class="style6">4.) Did The Studio Have Good Sanitary Conditions?</span></td>
            <td><span class="style6">
              <input name="Sanitary" type="radio" value="Yes" />
Yes </span></td>
            <td><span class="style6">
              <input name="Sanitary" type="radio" value="No" />
No</span></td>
          </tr>
          <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td><span class="style6">5.) Was The Quality Of The Work Performed Good?</span></td>
            <td><span class="style6">
<input name="GoodQualityWork" type="radio" value="Yes" /> 
Yes </span></td>
            <td><span class="style6">
              <input name="GoodQualityWork" type="radio" value="No" />
No</span></td>
          </tr>
          <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td><span class="style6">What Would Be Your Overall Rating Of The Studio?</span></td>
            <td colspan="2"><select name="OverallRating" size="1" id="OverallRating">
              <option value="">Select A Rating</option>
              <option value="1 - Poor">1 - Poor</option>
              <option value="2 - Not That Good">2 - Not That Good</option>
              <option value="3 - Good">3 - Good</option>
              <option value="4 - Very Good">4 - Very Good</option>
              <option value="5 - Excellent">5 - Excellent</option>
            </select></td>
          </tr>
          <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          
          <tr>
            <td><span class="style6">Additional Comments: *(Comment Area Has 255 Character Limit)</span></td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td><textarea name="AdditionalComments1" cols="55" rows="5" wrap="physical" id="AdditionalComments1" onKeyDown="limitText(this,255);" onKeyUp="limitText(this,255);"></textarea></td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td colspan="3"><div align="center">
              <input type="image" value="Submit" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Submit','','Navigation Buttons/SubmitOver.jpg',1)" img="img" src="Navigation Buttons/SubmitUp.jpg" name="Submit" width="134" height="49" border="0" id="Submit" />
            </div></td>
          </tr>
        </table>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
      
        
      
        
      
        
      
        
      
        <input type="hidden" name="MM_insert" value="StudioReviewForm">
      </form>
      
      <p>&nbsp;</p>
      <p>&nbsp;</p>
      <p>&nbsp;</p>
      <p><br />
        <br />
      </p></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
</body>
</html>
<%
rsStudioReviewed.Close();
%>

[anto_nee]

very big to read

[Felipo]

very big to read

anto_nee -

Sorry about the post being so big to read - I just figured I would list the code in its entirety so it would be clear as to what the page is doing -

I am new to this posting stuff and perhaps I should have just listed the javascrip which handles the form validation and the code which defines the form but then I figured that there may be something in the application (outside of the form definition and javascript validation) which may be causing the conflict or problem and that is why I decided to list all the code -

Do you think that was a wise thing to do -
Also thanks for taking the time to view my problem - Wish I could find a solution fo this - Its driving me crazy -

[anto_nee]

<form action="<%=MM_editAction%>" METHOD="POST" name="StudioReviewForm" id="StudioReviewForm" onsubmit="return validate form ( );">

may be like this

<form action="<%=MM_editAction%>" METHOD="POST" name="StudioReviewForm" id="StudioReviewForm" onsubmit="return validate_form( );">

you might be missing a underscore and a space here..

I couldnt go thru complete code as i am bit busy.. i will try to solve it( if this is not a prob) by tomorrow..

Cheer!!!

[Felipo]

<form action="<%=MM_editAction%>" METHOD="POST" name="StudioReviewForm" id="StudioReviewForm" onsubmit="return validate form ( );">

may be like this

<form action="<%=MM_editAction%>" METHOD="POST" name="StudioReviewForm" id="StudioReviewForm" onsubmit="return validate_form( );">

you might be missing a underscore and a space here..

I couldnt go thru complete code as i am bit busy.. i will try to solve it( if this is not a prob) by tomorrow..

Cheer!!!

Hi anto_nee -

Your suggetsion with the underscore and the space seems to have solved to the problem - The Javascript is beuing executed when I click the submit button thus the onsubmit is working -

However -

I have a cople of smaller problems now -

The Javascript only works for the first two IF statements - The one for the text box for the Submitted By and the 1st radio button for question 1 with regard to Courteous -

The other radio buttons are ignored and the dropdown list is ignored (but does get flagged on the server side via the MS Access Driver wanting the required field) the text area validation is also ignored -

I try to submit the form when it is entirely blank and the aforesaid occurs - If I satisfy the conditions which are being flagged the form does submit - I am wondering tho as to why the other form elemnts are not getting flagged as errors via the javascript -

I do appreciate your help tho in solving the initial problem with the script not being executed in the first place - The syntax is a killer and I am very surprised that the syntax was not flagged as being incorrect in some way -

If you need me to further explain the problem let me know - I would greatly appreciate it -

Once again thank you so much - I know you are very busy and I do appreciate you taking the time to help me thru this - I am so close tho now to success and it is becasue of you -

Talk to you later - Felipo......

[anto_nee]

Some Spellings missed out..

Knowledgable - Knowlegable..

For dropdown u should use "Value" not "selectindex"

so document.StudioReviewForm.OverallRating.selectedIndex == 0 is wrong

change to
document.StudioReviewForm.OverallRating.value == ""

Change this.. Everything will work..
And too javascript is case sensible..
Take Care..

[Felipo]

Some Spellings missed out..

Knowledgable - Knowlegable..

For dropdown u should use "Value" not "selectindex"

so document.StudioReviewForm.OverallRating.selectedIndex == 0 is wrong

change to
document.StudioReviewForm.OverallRating.value == ""

Change this.. Everything will work..
And too javascript is case sensible..
Take Care..

anto_nee -

The spelling mistake on knowlegable where I had it as knowledable was the culprit - I had left the drop down as "selectedIndex" and it works just fine - If that code was a problem I would have changed it to what you suggested which was "value"

I guess it took a fresh set of eyes to see the problems - I was unaware that Javascript was case sensitive - I am generally a stickler on case sensitivity - My mistakes were obviosuly careless and I should have taken more time to re-check and ensure the typographical errors - the syntax issue with the missing underscore was an oversight due to my inexperience in javascript -

You truly are the man!!! I can't thank you enough for the time you took out to help me with this problem -

If I run into any other problem with this tho I will let you know - but it all looks good thus far -

Again Thank You very very much for the help - I appreciate it -

How do I let this forum know that the problem has been solved and to let the forum know it was becasue you solved it - I would love to give vredit where credit is due -

Talk to you later.....Felipo -