close ad
 
Important WebAssist Announcement
open ad
View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

rating

Help with Condition Validation...

Thread began 2/09/2010 10:56 am by Gareth.TannattNash253613 | Last modified 2/23/2010 7:44 pm by Dani Chankhour | 3807 views | 15 replies |

Gareth.TannattNash253613

Help with Condition Validation...

Hi Guys,

I'm new to WA Validation and a little lost, I have a simple form - (Update Form)

With

<select name="accounttype"> m/a
<input type="text" id="dmxCalendar_1> Date input
<input type="text" id="dmxCalendar_2> Date Input
<input name="FreeTrial" type="checkbox" id="FreeTrial" value="Y" />

The basis is that the following form elements should be enables and validated if accounttype = m or disabled and not validated if account type = a

Enabled if accounttype = m
dmxCalendar_1
dmxCalendar_2
FreeTrial

Validated - Required if accounttype = m
dmxCalendar_1
dmxCalendar_2

Disabled and no validation if accounttype = a
dmxCalendar_1
dmxCalendar_2
FreeTrial

Hope that makes sense.....

Now I've got to a certain point where I have applied the validations, but can't see how to apply them to the select item as a variable... but not sure how to do it.........

my code is below...

<!--
function WAtrimIt(theString,leaveLeft,leaveRight) {
if (!leaveLeft) {
while (theString.charAt(0) == " ")
theString = theString.substring(1);
}
if (!leaveRight) {
while (theString.charAt(theString.length-1) == " ")
theString = theString.substring(0,theString.length-1);
}
return theString;
}

function WAFV_GetValueFromInputType(formElement,inputType,trimWhite) {
var value="";
if (inputType == "select") {
if (formElement.selectedIndex != -1 && formElement.options[formElement.selectedIndex].value && formElement.options[formElement.selectedIndex].value != "") {
value = formElement.options[formElement.selectedIndex].value;
}
}
else if (inputType == "checkbox") {
if (formElement.length) {
for (var x=0; x<formElement.length ; x++) {
if (formElement[x].checked && formElement[x].value!="") {
value = formElement[x].value;
break;
}
}
}
else if (formElement.checked)
value = formElement.value;
}
else if (inputType == "radio") {
if (formElement.length) {
for (var x=0; x<formElement.length; x++) {
if (formElement[x].checked && formElement[x].value!="") {
value = formElement[x].value;
break;
}
}
}
else if (formElement.checked)
value = formElement.value;
}
else if (inputType == "radiogroup") {
for (var x=0; x<formElement.length; x++) {
if (formElement[x].checked && formElement[x].value!="") {
value = formElement[x].value;
break;
}
}
}
else if (inputType == "iRite") {
var theEditor = FCKeditorAPI.GetInstance(formElement.name) ;
value = theEditor.GetXHTML(true);
}
else {
var value = formElement.value;
value=value.replace(/<p>(\&\#160\;)*<\/p>/,"");
}
if (trimWhite) {
value = WAtrimIt(value);
}
return value;
}

function WAAddError(formElement,errorMsg,focusIt,stopIt) {
if (document.WAFV_Error) {
document.WAFV_Error += "\n" + errorMsg;
}
else {
document.WAFV_Error = errorMsg;
}
if (!document.WAFV_InvalidArray) {
document.WAFV_InvalidArray = new Array();
}
document.WAFV_InvalidArray[document.WAFV_InvalidArray.length] = formElement;
if (focusIt && !document.WAFV_Focus) {
document.WAFV_Focus = focusIt;
}

if (stopIt == 1) {
document.WAFV_Stop = true;
}
else if (stopIt == 2) {
formElement.WAFV_Continue = true;
}
else if (stopIt == 3) {
formElement.WAFV_Stop = true;
formElement.WAFV_Continue = false;
}
}

function WAValidateRQ(formElement,errorMsg,focusIt,stopIt,trimWhite,inputType) {
var isValid = true;
if (formElement.length && inputType.toLowerCase()!="radio" && inputType.toLowerCase()!="select") formElement=formElement[0];
if (!document.WAFV_Stop && !formElement.WAFV_Stop) {
var value=WAFV_GetValueFromInputType(formElement,inputType,trimWhite);
if (value == "") {
isValid = false;
}
}
if (!isValid) {
WAAddError(formElement,errorMsg,focusIt,stopIt);
}
}
function WAAlertErrors(errorHead,errorFoot,setFocus,submitForm,allowOverride) {
if (!document.WAFV_StopAlert) {
document.WAFV_StopAlert = true;
if (document.WAFV_InvalidArray) {
document.WAFV_Stop = true;
var errorMsg = document.WAFV_Error;
if (errorHead!="")
errorMsg = errorHead + "\n" + errorMsg;
if (errorFoot!="")
errorMsg += "\n" + errorFoot;
document.MM_returnValue = false;
if (document.WAFV_Error!="") {
if (allowOverride) {
if (confirm(errorMsg.replace(/&quot;/g,'"'))) {
document.MM_returnValue = true;
return;
}
}
else {
alert(errorMsg.replace(/&quot;/g,'"'));
}
}
else if (submitForm)
submitForm.submit();
if (setFocus && document.WAFV_Focus) {
if (document.getElementById(document.WAFV_Focus.name+"___Config") && document.WAFV_Focus.type.toLowerCase() == "hidden") {
var theEditor = FCKeditorAPI.GetInstance(document.WAFV_Focus.name);
theEditor.EditorWindow.focus();
setTimeout("setTimeout('document.WAFV_Stop = false;document.WAFV_StopAlert = false;',1)",1);
}
else {
document.tempFocus = document.WAFV_Focus;
setTimeout("document.tempFocus.focus();setTimeout('document.WAFV_Stop = false;document.WAFV_StopAlert = false;',1)",1);
}
}
else {
document.WAFV_Stop = false;
document.WAFV_StopAlert = false;
}
for (var x=0; x<document.WAFV_InvalidArray.length; x++) {
document.WAFV_InvalidArray[x].WAFV_Stop = false;
}
}
else {
document.WAFV_Stop = false;
document.WAFV_StopAlert = false;
if (submitForm) {
submitForm.submit();
}
document.MM_returnValue = true;
}
document.WAFV_Focus = false;
document.WAFV_Error = false;
document.WAFV_InvalidArray = false;
}
}
function WAValidateCD(triggerElement,targetElement,enable) {
var isValid = true;
var invalidArray = document.WAFV_InvalidArray;
if (invalidArray) {
if (triggerElement == document)
isValid = false;
else {
for (var x=0; x<invalidArray.length && isValid; x++) {
if (invalidArray[x]==triggerElement) {
isValid = false;
}
}
}
}
if (!isValid) {
enable = !enable;
}
if (targetElement.length) targetElement=targetElement[0];
if (enable) {
targetElement.WAFV_Stop = false;
}
else {
targetElement.WAFV_Stop = true;
}
document.WAFV_Focus = false;
document.WAFV_Error = false;
document.WAFV_InvalidArray = false;
}
function iRiteState(editorInstance,enable) {
if (!enable) {
if (document.all) {
editorInstance.EditorDocument.body.disabled = true;
}
else {
editorInstance.EditorDocument.designMode = "off";
}
editorInstance.EditorWindow.parent.FCK.ToolbarSet.Disable();
document.buttonRefreshStateClone = editorInstance.EditorWindow.parent.FCKToolbarButton.prototype.RefreshState;
document.specialComboRefreshStateClone = editorInstance.EditorWindow.parent.FCKToolbarSpecialCombo.prototype.RefreshState;
editorInstance.EditorWindow.parent.FCKToolbarButton.prototype.RefreshState = function(){return false;};
editorInstance.EditorWindow.parent.FCKToolbarSpecialCombo.prototype.RefreshState = function(){return false;};
}
else {
if (document.all) {
editorInstance.EditorDocument.body.disabled = false;
}
else {
editorInstance.EditorDocument.designMode = "on";
}
editorInstance.EditorWindow.parent.FCK.ToolbarSet.Enable();
if (document.buttonRefreshStateClone) {
editorInstance.EditorWindow.parent.FCKToolbarButton.prototype.RefreshState = document.buttonRefreshStateClone;
editorInstance.EditorWindow.parent.FCKToolbarSpecialCombo.prototype.RefreshState = document.specialComboRefreshStateClone;
}
editorInstance.EditorWindow.parent.FCK.ToolbarSet.RefreshModeState();
}
}

function WAValidateEN(triggerElement,targetElement,enable) {
if (!document.WAFV_StopAlert) {
document.WAFV_StopAlert = true;
var isValid = true;
var invalidArray = document.WAFV_InvalidArray;
if (invalidArray) {
if (triggerElement == document)
isValid = false;
else {
for (var x=0; x<invalidArray.length && isValid; x++) {
if (invalidArray[x]==triggerElement) {
isValid = false;
}
invalidArray[x].WAFV_Stop = false;
}
}
}
if (!isValid) {
enable = !enable;
}
if (enable) {
if (document.getElementById(targetElement.name+"___Config") && targetElement.type.toLowerCase() == "hidden") {
var theEditor = FCKeditorAPI.GetInstance(targetElement.name);
iRiteState(theEditor,true);
}
else {
targetElement.disabled = "";
}
}
else {
if (document.getElementById(targetElement.name+"___Config") && targetElement.type.toLowerCase() == "hidden") {
var theEditor = FCKeditorAPI.GetInstance(targetElement.name);
iRiteState(theEditor,false);
}
else {
targetElement.disabled = "disabled";
targetElement.disabled = "true";
}
}
document.WAFV_Error = false;
document.WAFV_Focus = false;
document.WAFV_Stop = false;
document.WAFV_InvalidArray = false;
document.WAFV_StopAlert = false;
}
}
//-->
</script>

Sign in to reply to this post

Gareth.TannattNash253613

and the form is -

<form action="" method="post" name="updateaccount" id="updateaccount" onsubmit="WAValidateRQ(document.forms[0].dmxCalendar_1,'Start Date is required',document.forms[0].dmxCalendar_1,0,false,'text');WAValidateRQ(document.forms[0].dmxCalendar_2,'End Date is required',document.forms[0].dmxCalendar_2,0,false,'text');WAAlertErrors('The following errors were found','Correct invalid entries to continue',true,false,false);return document.MM_returnValue">
<fieldset>
<h3>Account Detail</h3>
<ul>
<li>
<label>Account Type <span class="redx">*</span>: </label>
<select name="accounttype" id="accounttype" onchange="WAValidateCD(document.forms[0].accounttype,document.forms[0].dmxCalendar_1,false);WAValidateEN(document.forms[0].accounttype,document.forms[0].dmxCalendar_1,false);WAValidateCD(document.forms[0].accounttype,document.forms[0].dmxCalendar_2,false);WAValidateEN(document.forms[0].accounttype,document.forms[0].dmxCalendar_2,false);WAValidateEN(document.forms[0].accounttype,document.forms[0].FreeTrial,false)">
<option value="m" <%If (Not isNull((CompanyDetail.Fields.Item("JBCLAccountType").Value))) Then If ("m" = CStr((CompanyDetail.Fields.Item("JBCLAccountType").Value))) Then Response.Write("selected=""selected""") : Response.Write("")%>>Fixed Term Contract</option>
<option value="a" <%If (Not isNull((CompanyDetail.Fields.Item("JBCLAccountType").Value))) Then If ("a" = CStr((CompanyDetail.Fields.Item("JBCLAccountType").Value))) Then Response.Write("selected=""selected""") : Response.Write("")%>>Pay as You Go</option>
</select>
</li>
<li>
<label>Start Date <span class="redx">*</span>: </label>
<input type="text" id="dmxCalendar_1" name="dmxCalendar_1" readonly="readonly" />
<script type="text/javascript">
// <![CDATA[
$(function() {$('#dmxCalendar_1').datepicker({
skin : "dmxCalendar",
dateFormat : "M d, yy",
showStatus : true,
numberOfMonths : [1,1],
showAnim : "fadeIn",
showOptions :
{
easing : "easeOutBounce",
direction : "up"
},
duration : "normal",
showOn : "both",
buttonImage : "../Styles/dmxCalendar/calendar_icon.gif",
buttonImageOnly : true,
prompt : ""
});})
// ]]>
</script>
</li><li>
<label>End Date <span class="redx">*</span>: </label>
<input type="text" id="dmxCalendar_2" name="dmxCalendar_2" readonly="readonly" />
<script type="text/javascript">
// <![CDATA[
$(function() {$('#dmxCalendar_2').datepicker({
skin : "dmxCalendar",
dateFormat : "M d, yy",
showStatus : true,
numberOfMonths : [1,1],
showAnim : "fadeIn",
showOptions :
{
easing : "easeOutBounce",
direction : "up"
},
duration : "normal",
showOn : "both",
buttonImage : "../Styles/dmxCalendar/calendar_icon.gif",
buttonImageOnly : true,
prompt : ""
});})
// ]]>
</script>
</li><li>
<label>Free Trial: </label>
<input name="FreeTrial" type="checkbox" id="FreeTrial" value="Y" />
</li>
<li>
<label></label>
<input type="submit" name="update" id="update" value="UPDATE" />
</li>
</ul>
</fieldset>
</form>

Sign in to reply to this post

Jimmy Wu

You would want to put conditional statements around the conditional validations to check the account type in the onsubmit section of the form, not in the onchange of the select list.

Sign in to reply to this post

Gareth.TannattNash253613

Please could you provide an example?

Thank you

Sign in to reply to this post

Jimmy Wu

It looks like you moved these validations to the onchange of the select box:
WAValidateCD(document.forms[0].accounttype,document.forms[0].dmxCalendar_1,false);WAValidateEN(document.forms[0].accounttype,document.forms[0].dmxCalendar_1,false);WAValidateCD(document.forms[0].accounttype,document.forms[0].dmxCalendar_2,false);WAValidateEN(document.forms[0].accounttype,document.forms[0].dmxCalendar_2,false);WAValidateEN(document.forms[0].accounttype,document.forms[0].FreeTrial,false)

You would want to undo that change. Then you would want to put in if statements similar to this:
if(<account type> == "m") WAValidateCD(document.forms[0].accounttype,document.forms[0].dmxCalendar_1,false);

Sign in to reply to this post

Gareth.TannattNash253613

Hi Jimmy,

I presume you mean change the code associated with the onchange event of the select item? - Sorry Mate not much good at Javascript - but this is what I have put, which doesn't work at all...

<form action="" method="post" name="updateaccount" id="updateaccount" onsubmit="WAValidateRQ(document.forms[0].dmxCalendar_1,'Start Date is required',document.forms[0].dmxCalendar_1,0,false,'text');WAValidateRQ(document.forms[0].dmxCalendar_2,'End Date is required',document.forms[0].dmxCalendar_2,0,false,'text');WAAlertErrors('The following errors were found','Correct invalid entries to continue',true,false,false);return document.MM_returnValue">
<fieldset>
<h3>Account Detail</h3>
<ul>
<li>
<label>Account Type <span class="redx">*</span>: </label>
<select name="accounttype" id="accounttype" onchange=if(<account type> == "m") WAValidateCD(document.forms[0].accounttype,document.forms[0].dmxCalendar_1,false) ">
<option value="m" <%If (Not isNull((CompanyDetail.Fields.Item("JBCLAccountType").Value))) Then If ("m" = CStr((CompanyDetail.Fields.Item("JBCLAccountType").Value))) Then Response.Write("selected=""selected""") : Response.Write("")%>>Fixed Term Contract</option>
<option value="a" <%If (Not isNull((CompanyDetail.Fields.Item("JBCLAccountType").Value))) Then If ("a" = CStr((CompanyDetail.Fields.Item("JBCLAccountType").Value))) Then Response.Write("selected=""selected""") : Response.Write("")%>>Pay as You Go</option>
</select>
</li>
<li>
<label>Start Date <span class="redx">*</span>: </label>
<input type="text" id="dmxCalendar_1" name="dmxCalendar_1" readonly="readonly" />

Appreciate your help.

Thank you

Sign in to reply to this post

Jimmy Wu

I was just giving you some pseudocode so that you could implement it yourself.

Just so I know how to better guide you, what changes have you made to the form and the validation since you created it?

Did you move some function calls to the onchange of the select?

Sign in to reply to this post

Gareth.TannattNash253613

At the moment, I just have the Form doing the following -

<form action="" method="post" name="updateaccount" id="updateaccount" onsubmit="WAAlertErrors('The following errors were found','Correct invalid entries to continue',true,false,false);return document.MM_returnValue">

But still have the select item reading like so -

<select name="accounttype" id="accounttype" onchange="WAValidateCD(document.forms[0].accounttype,document.forms[0].dmxCalendar_1,false);WAValidateEN(document.forms[0].accounttype,document.forms[0].dmxCalendar_1,false);WAValidateCD(document.forms[0].accounttype,document.forms[0].dmxCalendar_2,false);WAValidateEN(document.forms[0].accounttype,document.forms[0].dmxCalendar_2,false);WAValidateEN(document.forms[0].accounttype,document.forms[0].FreeTrial,false)">
<option value="m" <%If (Not isNull((CompanyDetail.Fields.Item("JBCLAccountType").Value))) Then If ("m" = CStr((CompanyDetail.Fields.Item("JBCLAccountType").Value))) Then Response.Write("selected=""selected""") : Response.Write("")%>>Fixed Term Contract</option>
<option value="a" <%If (Not isNull((CompanyDetail.Fields.Item("JBCLAccountType").Value))) Then If ("a" = CStr((CompanyDetail.Fields.Item("JBCLAccountType").Value))) Then Response.Write("selected=""selected""") : Response.Write("")%>>Pay as You Go</option>
</select>

All of which are OnChange -

Is this incorrect?

Appreciate any help you can give, as this really isn't my area of expertise - thanks

Sign in to reply to this post

Gareth.TannattNash253613

Anyone out there?

Sign in to reply to this post

Dani Chankhour

the check that you need to have for the validation should be something like this:

if(document.getElementById('accounttype').options[document.getElementById('accounttype').selectedIndex].value == "a")

or

if(document.getElementById('accounttype').options[document.getElementById('accounttype').selectedIndex].value == "m")

You could use that to check which validation to use.

I was not able to test this with your page. But if you post your file and any related sub folders (in a zip file), i can try to see where you exactly you need to place that code.

Sign in to reply to this post
loading

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question

Content

rating

Layout

rating

Ease of use

rating

security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...