• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 375
  • Last Modified:

Dreamweaver Template: not able to use Form Validation

I'm using templates with Dreamweaver CS4. I've created a template which includes the top menu and footer. The middle portion of the template is an editable region. I've been able to successfully create many pages using the template however I've added a few forms to the middle portion and have added form Validation using the Behaviors section of Dreamweaver. The validation works initially but if I make any change to the template it stops working!

Any suggestions of how to use a template and still use form validation?
0
agnassoc
Asked:
agnassoc
  • 3
  • 3
1 Solution
 
Jason C. LevineNo oneCommented:
Hi agnassoc,

Welcome to Experts Exchange.

>> The validation works initially but if I make any change to the template it stops working!

It sounds like the Template does not have enough editable regions.  When you edit the template and update the child pages, it is overwriting the changes made by the validation script.  

Post your Template code here and tell me exactly which steps you were taking to create a validation.


0
 
agnassocAuthor Commented:
I've posted the template code. The validation was created using the following steps:

1. Click on the Submit button of the form
2. add a new Behavior called 'Validate Form'
3. Select which fields are required and which ones require email addresses
4. Once this is completed in the tag inspector under Behaviors it says "on click" and "validate form'
<!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">
<!-- TemplateBeginEditable name="head" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Home Improvement University &gt; Benefits</title>
<link href="../style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
a:link {
	text-decoration: none;
	color: #000;
}
a:visited {
	text-decoration: none;
	color: #000;
}
a:active {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
	font-family: Georgia, "Times New Roman", Times, serif;
}
</style>

<script type="text/javascript">
<!--
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_nbGroup(event, grpName) { //v6.0
  var i,img,nbArr,args=MM_nbGroup.arguments;
  if (event == "init" && args.length > 2) {
    if ((img = MM_findObj(args[2])) != null && !img.MM_init) {
      img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;
      if ((nbArr = document[grpName]) == null) nbArr = document[grpName] = new Array();
      nbArr[nbArr.length] = img;
      for (i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
        if (!img.MM_up) img.MM_up = img.src;
        img.src = img.MM_dn = args[i+1];
        nbArr[nbArr.length] = img;
    } }
  } else if (event == "over") {
    document.MM_nbOver = nbArr = new Array();
    for (i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args[i])) != null) {
      if (!img.MM_up) img.MM_up = img.src;
      img.src = (img.MM_dn && args[i+2]) ? args[i+2] : ((args[i+1])? args[i+1] : img.MM_up);
      nbArr[nbArr.length] = img;
    }
  } else if (event == "out" ) {
    for (i=0; i < document.MM_nbOver.length; i++) {
      img = document.MM_nbOver[i]; img.src = (img.MM_dn) ? img.MM_dn : img.MM_up; }
  } else if (event == "down") {
    nbArr = document[grpName];
    if (nbArr)
      for (i=0; i < nbArr.length; i++) { img=nbArr[i]; img.src = img.MM_up; img.MM_dn = 0; }
    document[grpName] = nbArr = new Array();
    for (i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
      if (!img.MM_up) img.MM_up = img.src;
      img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;
      nbArr[nbArr.length] = img;
  } }
}
//-->
</script>
</head>
<!-- TemplateEndEditable -->
<body onload="MM_preloadImages('/images/navigation images/buttons/resources_up.gif','/images/navigation images/buttons/home_up.gif','/images/navigation images/buttons/courses_down.gif','/images/navigation images/buttons/about_down.gif','/images/navigation images/buttons/contact_down.gif','/images/navigation images/buttons/courses_up.gif','/images/navigation images/buttons/about_up.gif','/images/navigation images/buttons/contact_up.gif')">
<table width="800" border="0" align="center" bgcolor="#FFFFFF" cellpadding="0" cellspacing="0">
  <tr>
    <td colspan="4"><table width="799" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="228" rowspan="2"><a href="../home.html"><img src="../images/logo.jpg" width="228" height="83" border="0" /></a></td>
        <td width="452" height="47"><img src="../images/its-your-home-small.jpg" width="232" height="29" /></td>
        <td width="120"><img src="../images/phone-small.jpg" width="120" height="35" /></td>
        </tr>
      <tr>
        <td colspan="2" valign="bottom"><table border="0" cellpadding="0" cellspacing="0" align="right">
          <tr>
            <td><a href="../home.html" target="_top" onclick="MM_nbGroup('down','group1','Home','/images/navigation images/buttons/home_up.gif',1)" onmouseover="MM_nbGroup('over','Home','/images/navigation images/buttons/home_up.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="/images/navigation images/buttons/home_down.gif" alt="home" name="Home" border="0" id="Home" onload="" /></a></td>
            <td><a href="/courses.php" target="_top" onClick="MM_nbGroup('down','group1','Courses','/images/navigation images/buttons/courses_up.gif',1)" onMouseOver="MM_nbGroup('over','Courses','/images/navigation images/buttons/courses_up.gif','',1)" onMouseOut="MM_nbGroup('out')"><img name="Courses" src="/images/navigation images/buttons/courses_down.gif" border="0" alt="" onLoad="" /></a></td>
            <td><a href="../resources.html" target="_top" onClick="MM_nbGroup('down','group1','Resources','/images/navigation images/buttons/resources_up.gif',1)" onMouseOver="MM_nbGroup('over','Resources','/images/navigation images/buttons/resources_up.gif','',1)" onMouseOut="MM_nbGroup('out')"><img name="Resources" src="/images/navigation images/buttons/resources_down.gif" border="0" alt="" onLoad="" /></a></td>
            <td><a href="../intro.html" target="_top" onClick="MM_nbGroup('down','group1','About','/images/navigation images/buttons/about_up.gif',1)" onMouseOver="MM_nbGroup('over','About','/images/navigation images/buttons/about_up.gif','',1)" onMouseOut="MM_nbGroup('out')"><img name="About" src="/images/navigation images/buttons/about_down.gif" border="0" alt="" onLoad="" /></a></td>
            <td><a href="../contact.html" target="_top" onClick="MM_nbGroup('down','group1','Contact','/images/navigation images/buttons/contact_up.gif',1)" onMouseOver="MM_nbGroup('over','Contact','/images/navigation images/buttons/contact_up.gif','',1)" onMouseOut="MM_nbGroup('out')"><img name="Contact" src="/images/navigation images/buttons/contact_down.gif" border="0" alt="" onLoad="" /></a></td>
          </tr>
          </table></td>
        </tr>
      <tr>
        <td colspan="3"><img src="/images/top-banner-framed.jpg" width="800" height="151" /></td>
        </tr>
      <tr>
        <td height="66" colspan="3" bgcolor="#F7F8FC"><!-- TemplateBeginEditable name="page title" --><img src="/images/page titles/about.jpg" width="800" height="54" /><!-- TemplateEndEditable --></td>
        </tr>
    </table></td>
  </tr>
  <!-- TemplateBeginEditable name="submenu" -->
  <tr>
    <td height="67" colspan="4" align="left" valign="top"><table width="798" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="3" height="47">&nbsp;</td>
        <td width="154" valign="top"><table width="158" border="0" cellspacing="0" cellpadding="10">
          <tr>
            <td width="138" bgcolor="#68AC41" class="Heading2">About Us</td>
          </tr>
          <tr>
            <td valign="top" bgcolor="#E0E2E8"><p><a href="/template_subpages%20v11.html"><span class="submenu_active">&gt; Active Item</span></a><br />
              <span class="submenu_links"><a href="benefits.html">&gt; Item B</a><br />
                <a href="board.html">&gt; Item C               </a><br />
                <a href="careers.html">&gt; Item D</a></span></p></td>
          </tr>
        </table></td>
        <td width="10">&nbsp;</td>
        <td width="636" valign="top"><table width="632" border="0" cellspacing="0" cellpadding="10">
          <tr bgcolor="#E0E2E8">
            <td width="611" align="left" bgcolor="#68AC41"><span class="Heading2">Overview</span></td>
          </tr>
          <tr>
            <td bgcolor="#E0E2E8"><p align="justify">It doesnt take a contractor to be a contractor. HIUs  comprehensive, <strong>hands-on</strong> courses are designed to make every person  capable of doing what might generally take a hired-hand to accomplish. From laying  a brand new floor to plumbing basics to extensive renovation how-tos, <strong>HIU  provides live classes</strong> that will show you how you can do it by yourself.</p>
              <p align="justify"> At each class an experienced contractor will draw on  their years of experience (same word twice please  think of something else) and provide instructions on the easiest way  to complete the project, common pitfalls to avoid, and how to select and  purchase the best materials at the best price.</p></td>
          </tr>
          <tr>
            <td bgcolor="#68AC41"><span class="Heading2">Save Money</span></td>
          </tr>
          <tr bgcolor="#E0E2E8">
            <td>Contractors and other professionals, even the most  reasonable among them, are expensive, but the cost of repair doesnt have to  include labor if you can do the work yourself. The price of the materials and a  little bit of your time is the only expenditure when you have the know-how. HIU  gives you that knowledge. Learn it once and use it forever. <br /></td>
          </tr>
          <tr>
            <td bgcolor="#68AC41"><span class="Heading2">Hands-on Learning </span></td>
          </tr>
          <tr bgcolor="#E0E2E8">
            <td><p align="justify">People delay their renovations and repairs for  financial reasons or due to a lack of ability and interest. HIU will give you  the skills and the means to get things done and show you how fun being the  contractor can be. No more worries about funding or fixing. Just get down to  business and take care of all your home improvement needs. <br />
            </p>
              <p align="justify">Our experienced instructors wont only  teach you and talk you through the projects you hope to tackle. They will  actually aid you in completing a hands-on task at the end of the class. You  will lay your own tile floor, construct your own drywall  (not sure if you construct drywall please think of something else),  actually use the power tools you learned about and much, much more. Whatever  you learn, you will also do during every one of HIUs comprehensive courses.   </p></td>
          </tr>
          <tr>
            <td bgcolor="#68AC41"><span class="Heading2">Skills for life</span></td>
          </tr>
          <tr bgcolor="#E0E2E8">
            <td height="81">With the skills and the knowledge of a pro you will be able to step  back and appreciate your accomplishments. Then, when the time comes for  the next repair or upgrade, you will be an experienced professional  with the confidence to do it all over again.</td>
          </tr>
        </table></td>
        </tr>
    </table></td>
  </tr>
  <!-- TemplateEndEditable -->
  <tr>
    <td colspan="4"><table width="800" border="0" cellspacing="0" cellpadding="0">
      <tr height="1px">
        <td height="1px" bgcolor="#CCCCCC">&nbsp;</td>
      </tr>
      <tr>
        <td height="1" bgcolor="#CED7EE">&nbsp;</td>
        </tr>        
      <tr>
        <td><img src="/images/bottom-banner.jpg" width="800" height="162" border="0" usemap="#Map" /></td>
        </tr>
      <tr>
        <td bgcolor="#BECAE8">&nbsp;</td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td height="18" colspan="4" bgcolor="#BDC7DE"><table width="779" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td width="30" height="26" bgcolor="#71C05B">&nbsp;</td>
        <td width="103" bgcolor="#71C05B" class="Heading2">About Us</td>
        <td width="61" bgcolor="#71C05B">&nbsp;</td>
        <td width="9" bgcolor="#71C05B">&nbsp;</td>
        <td width="126" bgcolor="#71C05B"><span class="Heading2">Courses</span></td>
        <td width="41" bgcolor="#71C05B">&nbsp;</td>
        <td width="8" bgcolor="#71C05B">&nbsp;</td>
        <td width="34" bgcolor="#71C05B">&nbsp;</td>
        <td width="120" bgcolor="#71C05B" class="Heading2">Resources</td>
        <td width="33" bgcolor="#71C05B">&nbsp;</td>
        <td width="7" bgcolor="#71C05B">&nbsp;</td>
        <td width="15" bgcolor="#71C05B">&nbsp;</td>
        <td width="135" bgcolor="#71C05B" class="Heading2">Contact Us</td>
        <td width="57" bgcolor="#71C05B">&nbsp;</td>
        </tr>
      <tr>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8" class="footer_links"><a href="../intro.html">Introduction</a></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td rowspan="6" bgcolor="#E0E2E8"><img src="/images/vertical-line.jpg" width="3" height="110" /></td>
        <td bgcolor="#E0E2E8" class="footer_links"><a href="../courses ovnerwwwerview.html">Overview</a></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td rowspan="6" bgcolor="#E0E2E8"><img src="/images/vertical-line.jpg" width="3" height="110" /></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8" class="footer_links"><a href="../experts.html">Ask the Experts</a></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td rowspan="6" bgcolor="#E0E2E8"><img src="/images/vertical-line.jpg" width="3" height="110" /></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8" class="footer_links"><a href="../contact.html">How to Reach Us</a></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        </tr>
      <tr>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8" class="footer_links"><a href="../benefits.html">Benefits</a></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8" class="footer_links"><a href="../courses.php">Course Listings</a></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8" class="footer_links"><a href="../reviews.html">Product Reviews</a></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8" class="footer_links"><a href="../contact.html">Contact Form</a></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        </tr>
      <tr>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8" class="footer_links"><a href="../board.html">Advisory Board</a></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8" class="footer_links"><a href="../suggestion.php">Suggest A Course</a></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8" class="footer_links"><a href="../newsletter.html">Free Newsletter</a></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        </tr>
      <tr>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8" class="footer_links"><a href="../careers.php">Careers</a></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8" class="footer_links"><a href="../articles.html">Articles</a></td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        </tr>
      <tr>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        </tr>
      <tr>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        <td bgcolor="#E0E2E8">&nbsp;</td>
        </tr>
    </table></td>
  </tr>
  <tr>
    <td height="18" colspan="4" bgcolor="#B3C0E0">&nbsp;</td>
  </tr>
  <tr>
    <td width="18" height="80">&nbsp;</td>
    <td width="273" bgcolor="#FFFFFF">Home Improvement University<br />
      244 Park Ave<br />
      New York, NY 10004</td>
    <td width="395"><img src="../images/credibibility-logos.jpg" alt="" width="371" height="51" /></td>
    <td width="115">designed by <a href="/shana home.html">SSDesign Studios</a></td>
  </tr>
</table>

<map name="Map" id="Map">
  <area shape="rect" coords="7,4,256,159" href="../experts.html" alt="ask the experts" />
  <area shape="rect" coords="261,3,521,159" href="../newsletter.html" alt="newsletter signup" />
  <area shape="rect" coords="522,4,794,157" href="../courses.php" alt="upcoming courses" />
</map>
</body>
</html>

Open in new window

0
 
Jason C. LevineNo oneCommented:
You have a small issue with the head section of your template.  You have the editable region outside of the <head> tags:

<!-- TemplateBeginEditable name="head" -->
<head>
...
...
</head>
<!-- TemplateEndEditable -->

So what is happening when you insert the validation is that the MM_Validation script is being written to the wrong location.  Simply change the template lines above to reverse the order of the tags:

<head>
<!-- TemplateBeginEditable name="head" -->
...
...
<!-- TemplateEndEditable -->
</head>

Save the template, let it update the child pages and then open a child page and reapply the validation behavior.  It should work properly after that.  Just FYI, this method of form validation is not the best one to use in CS4. You should look at Spry validation instead.
0
Prep for the ITIL® Foundation Certification Exam

December’s Course of the Month is now available! Enroll to learn ITIL® Foundation best practices for delivering IT services effectively and efficiently.

 
agnassocAuthor Commented:
You were correct about the head section of the template but that alone didn't solve the issue. There was an extra <head> tag in the file which had the form. Thanks for your help on this!

What advantages does Spry provide over the regular form validation?
0
 
Jason C. LevineNo oneCommented:
>> What advantages does Spry provide over the regular form validation?

It's an AJAX technology, so fields can be validated one by one instead of waiting for the form to submit.  It doesn't use the obnoxious popup to notify.  It is much more flexible, providing many more options than simple required fields.
0
 
agnassocAuthor Commented:
A real pleasure to deal with. Answers are very clear and straight to the point!
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

  • 3
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now