#1
  1. No Profile Picture
    Contributing User
    ASP Discoverer (100 - 499 posts)

    Join Date
    Oct 2005
    Posts
    225
    Rep Power
    24

    Dropdown validation- using Shadow Wizard validation


    Create the following code from database but does not validate on enter - I am using ShadowWizards validation code.
    <Input fields so work however I will need dropdown and radio buttons to be validated also.

    I really like the work ShadowWizard has put in and would like to continue in the same neat, cleaver coded way!

    I did validate the few fields with ASP but Yahoo toolbar stops people going back on forms and therefor would not work on all PC's, typically the bosses and now he seems to want it asap so any javascript solution?

    Code:
    <html>
    <head>
    <title>Form Validation Example</title>
    <script type="text/javascript" src="Validation.js"></script>
    <script type="text/javascript">
    
    function valDrop(val) {
    if (val == '') return false;
    else return true;
    } 
    
    function MyValidate(objElement) {
    var strText=objElement.value;	
    //allow empty phone number:
    if (strText.length == 0)
    	return true;	
    //check for "-" character:
    return strText.indexOf("-")>0;
    return true;
    }
    </script>
    </head>
    <!-------------------------------------------------------------------------------------------------------------->
    <form show_alert="1" onsubmit="return Validate(this);" method="post" action="telenq_add.asp">
    <table>
    
    
    
    
    	
    <select name="years1" onChange="">
    
    <option class="capitalize" value="" maxlength=""  validate="not_empty" msg="please select time at address|invaild address time" selected>Years At Address</option>		
    
    
    <option value="0"> 0 </option>				
    
    <option value="1"> 1 </option>				
    
    <option value="2"> 2 </option>		
    
    <option value="3"> 3 </option>
    <option value="4"> 4 </option>		
    			
    
    </select>													
    </table>
    <button type="submit">Submit</button>
    </form>
    </html>
  2. #2
  3. Cunning Linguist
    ASP High Scholar (3500 - 3999 posts)

    Join Date
    Mar 2005
    Location
    I used to live at home, now I stay at the house
    Posts
    3,580
    Rep Power
    432
    Post all of the code. Or a link to the page.
    Support requests via PM will be ignored!
    Route of Queue | The General FAQ Thread | HOW TO POST A QUESTION

    Perfectly Impossible - is the eagerly awaited debut release from Jayne Sarah - please buy it - it's really good!

  4. #3
  5. No Profile Picture
    Contributing User
    ASP Discoverer (100 - 499 posts)

    Join Date
    Oct 2005
    Posts
    225
    Rep Power
    24
    All of code...

    attached
    Attached Files
    Last edited by Phoenix_riser; May 17th, 2006 at 09:35 AM.
  6. #4
  7. Cunning Linguist
    ASP High Scholar (3500 - 3999 posts)

    Join Date
    Mar 2005
    Location
    I used to live at home, now I stay at the house
    Posts
    3,580
    Rep Power
    432
    Can't you just post the code? Or even better, a link to a live
    demo of it...?
  8. #5
  9. No Profile Picture
    Contributing User
    ASP Discoverer (100 - 499 posts)

    Join Date
    Oct 2005
    Posts
    225
    Rep Power
    24
    It did not fit in 3 reply boxes that is why. Not got ASP server yet for external :-(

    It only an access 97 DB with code to post to it though I removed most of the post to code as the databases are huge and confidential :-S
  10. #6
  11. No Profile Picture
    Contributing User
    ASP Discoverer (100 - 499 posts)

    Join Date
    Oct 2005
    Posts
    225
    Rep Power
    24
    Been through and removed all other parts that work....

    Index2.asp is dynamic but have put below in Index2.asp the version you see when you do view, source...

    Index2.asp

    Code:
    <html>
    <head>
    <title>Form Validation Example</title>
    <script type="text/javascript" src="Validation.js"></script>
    <script type="text/javascript">
    
    function valDrop(val) {
    if (val == '') return false;
    else return true;
    } 
    
    function MyValidate(objElement) {
    var strText=objElement.value;	
    //allow empty phone number:
    if (strText.length == 0)
    	return true;	
    //check for "-" character:
    return strText.indexOf("-")>0;
    return true;
    }
    </script>
    </head>
    <body>
    <div align="right">
    <table width="972" border="0" cellspacing="0" cellpadding="0">
    <tr><td width="584"><H1>Application Form</H1></td>
    <td width="388"><div align="right"><h2>New Customer Application Form</h2></td>
    </tr>
    </table>
    </div>
    <!-------------------------------------------------------------------------------------------------------------->
    <form show_alert="1" onsubmit="return Validate(this);" method="post" action="telenq_add.asp">
    <table>
    <div align="left">			
    																						
    											<tr><td width="180">Years At Address</td>
    											<td width="250">		
    											<select name="years1" onChange="">
    
    <option class="capitalize" value="" maxlength=""  validate="not_empty" msg="please select time at address|invaild address time" selected>Years At Address</option>		
    
    
    <option value="0"> 0 </option>				
    
    <option value="1"> 1 </option>				
    
    <option value="2"> 2 </option>				
    
    <option value="3"> 3 </option>				
    				
    
    </select>										
    											<tr><td width="180">Type</td>
    											<td width="250">		
    											<input name="buttontest" type="radio" value="2">V2<tr>
    <td></td><td><input name="buttontest" type="radio" value="1">V1</td></tr><tr>
    <td></td><td><p>
    <p>&nbsp;</p></td></tr>	</table>
    </div>
    <button type="submit">Submit</button>
    </form>
    </body>
    </html>

    And the include for posting the data....


    Code:
    <%Option Explicit 
    Dim Error1
    If Request.Form("buttontest") = "" Then 
    Response.Write("Please let us know where you hear about us from")
    Error1 = 1
    End If
    
    If Error1 = 1 Then
    %>
    
    Please go back and correct missing field(s)
    <input type="button" value="Go back" onclick="history.back();">
    <%else
    end if %>


    Validation code....

    Code:
    /*
    ShadowValidation
    ----------------
    
    Generic Form Validation.
    To activate this validation, add attributes to your form elements.
    Attribute "validate" defines what type of validation you want.
    Possible values for "validate" attribute:
    	"not_empty" - element can't be empty.
    	"integer" - element must have integer value.
    	"number" - element must have numeric value.
    	"email" - element value must be valid email address.
    	[function name] - vaidate using your own function. see below for more details.
    You can join more than one validation type by using the "|" character.
    For example:
    	<input type="text" name="myinput" validate="not_empty|number" />
    	will force not empty and numeric value.
    Attribute "msg" defines the message to display when validation fails.
    For example:
    	<input type="text" name="myinput" validate="not_empty|number" msg="please enter value|invalid value" />
    	will show "please enter value" if value is empty and "invalid value" if not numeric.
    By default, the message will appear next to the form element.
    You can have the message appear as alert dialog by adding show_alert attribute to the form.
    For example:
    	<form show_alert="1" onsubmit="return Validate(this);">
    	will show the messages as alerts.
    
    Advanced:
    	You can use your own function to validate the data.
    	For this, write the function name as the value of "validate" attribute.
    	For example:
    		<input type="text" name="myinput" validate="MyValidate" />
    	The function must get the form element as its parameter and return true if valid or false otherwise.
    
    
    Written by:
    	 Shadow Wizard, 2006
    
    */
    
    function Validate(objForm) {
    var arrValidated=new Array();
    
    for (var i=0; i<objForm.elements.length; i++) {
    	var element=objForm.elements[i];
    	var elName=element.name;
    	if ((!elName)||(elName.length == 0)||(arrValidated[elName]))
    		continue;
    	arrValidated[elName] = true;
    	var validationType = element.getAttribute("validate");
    	if ((!validationType)||(validationType.length == 0))
    		continue;
    	var strMessages=element.getAttribute("msg");
    	if (!strMessages)
    		strMessages = "";
    	var arrMessages = strMessages.split("|");
    	var arrValidationTypes = validationType.split("|");		
    	for (var j=0; j<arrValidationTypes.length; j++) {
    		var curValidationType = arrValidationTypes[j];
    		var blnValid=true;
    		switch (curValidationType) {
    			case "not_empty":
    				blnValid = ValidateNotEmpty(element);
    				break;
    			case "integer":
    				blnValid = ValidateInteger(element);
    				break;
    			case "number":
    				blnValid = ValidateNumber(element);
    				break;
    			case "email":
    				blnValid = ValidateEmail(element);
    				break;
    			default:
    				try {
    					blnValid = eval(curValidationType+"(element)");
    				}
    				catch (ex) {
    					blnValid = true;
    				}
    		}
    		if (blnValid == false) {
    			var message="invalid value for "+element.name;
    			if ((j < arrMessages.length)&&(arrMessages[j].length > 0))
    				message = arrMessages[j];
    			InsertError(element, message);
    			if ((typeof element.focus == "function")||(element.focus)) {
    				element.focus();
    			}
    			return false;
    		}
    		else
    			ClearError(element);
    	}
    	
    }
    
    return true;
    }
    
    function ValidateNotEmpty(objElement) {
    var strValue = GetElementValue(objElement);
    return (strValue.length > 0);
    }
    
    function ValidateInteger(objElement) {
    var strValue = GetElementValue(objElement);
    return (!isNaN(parseInt(strValue)));
    }
    
    function ValidateNumber(objElement) {
    var strValue = GetElementValue(objElement);
    return (!isNaN(parseFloat(strValue)));
    }
    
    function ValidateEmail(objElement) {
    var strValue = GetElementValue(objElement);
    if (strValue.length < 5)
    	return false;
    var arrTemp=strValue.split("@");
    if (arrTemp.length != 2)
    	return false;
    var strLeftPart = arrTemp[0];
    var strRightPart = arrTemp[1];
    if ((strLeftPart.length == 0)||(strRightPart.length == 0))
    	return false;
    arrTemp = strRightPart.split(".");
    if (arrTemp.length < 2)
    	return false;
    for (var i=0; i<arrTemp.length; i++) {
    	if (arrTemp[i].length == 0)
    		return false;
    }
    return true;
    }
    
    function GetElementValue(objElement) {
    var result="";
    switch (objElement.type) {
    	case "text":
    	case "hidden":
    	case "textarea":
    	case "password":
    		result = objElement.value;
    		break;
    	case "select-one":
    	case "select":
    		if (objElement.selectedIndex >= 0)
    			result = objElement.options[objElement.selectedIndex].value;
    		break;
    	case "radio":
    	case "checkbox":
    		for (var i=0; i<objElement.form.elements.length; i++) {
    			if (objElement.form.elements[i].name == objElement.name) {
    				if (objElement.form.elements[i].checked)
    					result += objElement.form.elements[i].value+",";
    			}
    		}
    		break;
    }
    return result;
    }
    
    function InsertError(element, strMessage) {
    if ((element.form.getAttribute("show_alert")) && (element.form.getAttribute("show_alert") != "0")) {
    	alert(strMessage);
    	return;
    }
    
    var strSpanID = element.name+"_val_error";
    var objSpan = document.getElementById(strSpanID);
    if (!objSpan) {
    	if ((element.type == "radio")||(element.type == "checkbox")) {
    		for (var i=0; i<element.form.elements.length; i++) {
    			if (element.form.elements[i].name == element.name) {
    				element = element.form.elements[i];
    			}
    		}
    	}
    	objSpan = document.createElement("span");
    	objSpan.id = strSpanID;
    	objSpan.className = "validation_error";
    	var nodeAfter=0;
    	var nodeParent = element.parentNode;
    	for (var i=0; i<nodeParent.childNodes.length; i++) {
    		if (nodeParent.childNodes[i] == element) {
    			if (i < (nodeParent.childNodes.length-1))
    				nodeAfter = nodeParent.childNodes[i+1];
    			break;
    		}
    	}
    	if ((!nodeAfter)&&(nodeParent.parentNode)) {
    		nodeParent = nodeParent.parentNode;
    		for (var i=0; i<nodeParent.childNodes.length; i++) {
    			if (nodeParent.childNodes[i] == element.parentNode) {
    				if (i < (nodeParent.childNodes.length-1))
    					nodeAfter = nodeParent.childNodes[i+1];
    				break;
    			}
    		}
    	}
    	if (nodeAfter)
    		nodeParent.insertBefore(objSpan, nodeAfter);
    	else
    		document.body.appendChild(objSpan);
    }
    objSpan.innerHTML = strMessage;
    }
    
    function ClearError(element) {
    var strSpanID = element.name+"_val_error";
    var objSpan = document.getElementById(strSpanID);
    if (objSpan) {
    	objSpan.innerHTML = "";
    }
    }
  12. #7
  13. Cunning Linguist
    ASP High Scholar (3500 - 3999 posts)

    Join Date
    Mar 2005
    Location
    I used to live at home, now I stay at the house
    Posts
    3,580
    Rep Power
    432
    No offense to Shadow, but I wouldn't use that code. You are
    only validating a select element and two radio buttons. That's
    some pretty simple JS to check that. It's probly no more than
    10 lines of code to do the whole thing.

    I'm at Uni at the min, so I can't script it now, but I'll have a
    go later on if you still haven't fixed it.

    Have a go at writing it yourself though, see where you get.
  14. #8
  15. No Profile Picture
    Contributing User
    ASP Discoverer (100 - 499 posts)

    Join Date
    Oct 2005
    Posts
    225
    Rep Power
    24
    Originally Posted by ChiefWigs1982
    No offense to Shadow, but I wouldn't use that code. You are
    only validating a select element and two radio buttons. That's
    some pretty simple JS to check that. It's probly no more than
    10 lines of code to do the whole thing.

    I'm at Uni at the min, so I can't script it now, but I'll have a
    go later on if you still haven't fixed it.

    Have a go at writing it yourself though, see where you get.
    That is the cut down version, some have several buttons & some have up to 50 items in the drop down box! it is created from a database so I had to write out the simpler version.

    In terms of looking at fields with "input" in Shadows in great for that. Just to to be able to validate every single:

    Drop downs
    Radio Buttons

    Where I want, I would also sometimes not want to check them and leave it blank

    The more dynamic the better as ever
  16. #9
  17. No Profile Picture
    Contributing User
    ASP Discoverer (100 - 499 posts)

    Join Date
    Oct 2005
    Posts
    225
    Rep Power
    24
    Okay got time to sit down with my book and this forum and came up with the code below. It worked - yeah but then on reset it resets the values on my computer but where Yahoo (it seems) is installed it holds the values thus on reset how can I force reset of all values.

    Code:
    
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    	"http://www.w3.org/TR/html4/loose.dtd">
    <HTML>
    <HEAD>
    	<TITLE>Selector</TITLE>
    	<SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT">
    		<!-- Hide script from older browsers
    
    		function isNum(passedVal) {					// Is this a number?
    			if (passedVal == "") {
    				return false
    			}
    			for (i=0; i<passedVal.length; i++) {
    				if (passedVal.charAt(i) < "0") {
    					return false
    				}
    				if (passedVal.charAt(i) > "9") {
    					return false
    				}
    			}
    			return true
    		}
    
    
    		function submitIt(CheckForm) {
    
    			//
    			valueChoice = CheckForm.Agent.selectedIndex
    			if (CheckForm.Agent.options[valueChoice].value == "") {
    				alert("You must pick an agent")
    				return false
    			}
    	
    			//
    			Amount = -1
    			for (i=0; i<CheckForm.Amount.length; i++) {
    				if (CheckForm.Amount[i].checked) {
    					Amount = i
    				}
    			}
    			if (Amount == -1) {
    				alert("You must choose an amount")
    				return false
    			}
    			
    			// If we made it to here, everything's valid, so return true
    			return true
    		}
    		// End hiding script -->
    	</SCRIPT>	
    </HEAD>
    <BODY BGCOLOR="WHITE">
    <H2 ALIGN="CENTER">Selector</H2>
    <FORM onSubmit="return submitIt(this)" ACTION="thankyou.htm" NAME="myForm">
    	<TABLE BORDER="0" CELLSPACING="8" CELLPADDING="8">
    		<TR>
    			<TD ALIGN="RIGHT">
    				Agent:
    			</TD>
    			<TD>
    				<SELECT NAME="Agent">
    					<OPTION VALUE="" SELECTED>Choose a Agent
    					<OPTION VALUE="Barry">Barry
    					<OPTION VALUE="Sam">Sam
    					<OPTION VALUE="Darren">Darren
    				</SELECT>
    			</TD>
    		</TR>
    		<TR>
    			<TD ALIGN="RIGHT">
    				Amount:
    			</TD>
    			<TD>
    				<INPUT TYPE="RADIO" VALUE="0" NAME="Amount">0
    				<INPUT TYPE="RADIO" VALUE="100" NAME="Amount">100
    			</TD>
    		</TR>
    		<TR>
    			<TD COLSPAN="2">
    				<P><INPUT TYPE="SUBMIT" VALUE="Submit">&nbsp;
    				<INPUT TYPE="reset" VALUE="reset" NAME="reset">
    			</TD>
    		</TR>
    	</TABLE>
    </FORM>
    </BODY>
    </HTML>

Similar Threads

  1. Dropdown validation to add onto shadwizard validation
    By Phoenix_riser in forum ASP Development
    Replies: 2
    Last Post: May 17th, 2006, 08:35 AM
  2. Shadow Wizard - I'm Back
    By Space Deity in forum ASP Free Lounge
    Replies: 30
    Last Post: May 10th, 2006, 11:32 AM
  3. Trouble with Dropdown List Validation
    By PhrostED in forum .NET Development
    Replies: 6
    Last Post: May 2nd, 2005, 12:07 AM
  4. ASP.NET client side validation on dropdown postback
    By taoofyoga in forum .NET Development
    Replies: 6
    Last Post: July 1st, 2004, 02:30 AM
  5. Validation of Dropdown list
    By udayjdesai in forum .NET Development
    Replies: 6
    Last Post: January 24th, 2004, 02:00 AM

IMN logo majestic logo threadwatch logo seochat tools logo