Help is javascript validation script

[MrFahad]

Hello,
I have a javascript for form validation but it is not working i don't know why i think it is because i called the javascript function wrong please help.

here is the source code:

HTML form code:

<form name="form" id="form" action="create_property.php" onSubmit="return validate(this) ;" method="post" >
<fieldset>
        <legend><b>Property Type</b></legend>
        <p>Please enter the type of the property that you are adding: 
<select name="PropertyType">
        <option value="1">Aapartment</option>
<option value="2">Villa</option>
        </select>
        </p></fieldset>
</p>
 <p>&nbsp;</p>
 <label for="PropertyAddress">Property Address:</label>
         <input name="PropertyAddress" type="text" id="PropertyAddress"/>
 <p>&nbsp;</p>
 <label for="Area">Area:</label>
       <input name="Area" type="text" value="" id="Area" /> *only numbers allowed, use meter sequire</p>
 <p>&nbsp;</p>
        <p> Listing Price:
       <input name="listedPrice" type="text" value="" id="listedPrice"/>
       </p>
        <p>&nbsp;</p>
 <p>Number of bed rooms:
  <select name="No_bedroom">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
    </select>
 </p>
 <p>&nbsp;</p>
       <p>Listing Date:
       
<select name="lmonth">
          
    <option value='01'>January</option>
          <option value='02'>February</option>
          <option value='03'>March</option>
          <option value='04'>April</option>
          <option value='05'>May</option>
          <option value='06'>June</option>
          <option value='07'>July</option>
          <option value='08'>August</option>
          <option value='09'>September</option>
          <option value='10'>October</option>
          <option value='11'>November</option>
          <option value='12'>December</option>
         </select>
        
        Month
        <select name="ldate" >
         <option value='01'>01</option>
         <option value='02'>02</option>
         <option value='03'>03</option>
         <option value='04'>04</option>
         <option value='05'>05</option>
         <option value='06'>06</option>
         <option value='07'>07</option>
         <option value='08'>08</option>
         <option value='09'>09</option>
         <option value='10'>10</option>
         <option value='11'>11</option>
         <option value='12'>12</option>
         <option value='13'>13</option>
         <option value='14'>14</option>
         <option value='15'>15</option>
         <option value='16'>16</option>
         <option value='17'>17</option>
         <option value='18'>18</option>
         <option value='19'>19</option>
         <option value='20'>20</option>
         <option value='21'>21</option>
         <option value='22'>22</option>
         <option value='23'>23</option>
         <option value='24'>24</option>
         <option value='25'>25</option>
         <option value='26'>26</option>
         <option value='27'>27</option>
         <option value='28'>28</option>
         <option value='29'>29</option>
         <option value='30'>30</option>
         <option value='31'>31</option>
        </select>
        Date
        <input name="lyear" type="text" size="4" />
       Year(yyyy)</p>
       <p>&nbsp;</p>
      <p>Date build: 
      <select name="month">
          
    <option value='01'>January</option>
          <option value='02'>February</option>
          <option value='03'>March</option>
          <option value='04'>April</option>
          <option value='05'>May</option>
          <option value='06'>June</option>
          <option value='07'>July</option>
          <option value='08'>August</option>
          <option value='09'>September</option>
          <option value='10'>October</option>
          <option value='11'>November</option>
          <option value='12'>December</option>
         </select>
        
        Month
        <select name="date" >
         <option value='01'>01</option>
         <option value='02'>02</option>
         <option value='03'>03</option>
         <option value='04'>04</option>
         <option value='05'>05</option>
         <option value='06'>06</option>
         <option value='07'>07</option>
         <option value='08'>08</option>
         <option value='09'>09</option>
         <option value='10'>10</option>
         <option value='11'>11</option>
         <option value='12'>12</option>
         <option value='13'>13</option>
         <option value='14'>14</option>
         <option value='15'>15</option>
         <option value='16'>16</option>
         <option value='17'>17</option>
         <option value='18'>18</option>
         <option value='19'>19</option>
         <option value='20'>20</option>
         <option value='21'>21</option>
         <option value='22'>22</option>
         <option value='23'>23</option>
         <option value='24'>24</option>
         <option value='25'>25</option>
         <option value='26'>26</option>
         <option value='27'>27</option>
         <option value='28'>28</option>
         <option value='29'>29</option>
         <option value='30'>30</option>
         <option value='31'>31</option>
        </select>
        Date
        <input name="year" type="text" size="4" />
       Year(yyyy)</p>
      <p>Description:</p>
       <p>
        <textarea name="description" cols="100" rows="5" value="" id="description"></textarea>
<input type="submit" value="submit" />
 </form>

here is the javascript source:

// form validation function //
function validate(form) {
 
 var PropertyAddress = form.PropertyAddress.value;
 var area = form.area.value;
 var price = form.price.value;
 var gender = form.gender.value;
 var discription = form.discription.value;
 var nameRegex = /^[a-zA-Z]+(([\'\,\.\- ][a-zA-Z ])?[a-zA-Z]*)*$/;
 var addressRegex = /^[a-zA-Z]+(([\'\,\.\- ][a-zA-Z ])?[a-zA-Z]*)*$/;
 var discriptionRegex = new RegExp(/<\/?\w+((\s+\w+(\s*=\s*(?:".*?"¦'.*?'¦[^'">\s]+))?)+\s*¦\s*)\/?>/gim);
 var areaRegex = /[^0-9]/g;
 var price = /[^0-9]/g;
 
 
 if(PropertyAddress == "") {
  inlineMsg('PropertyAddress','<strong>Error</strong><br />You must enter the address of the property.',2);
  return false;
 }
 if(!PropertyAddress.match(addressRegex)) {
  inlineMsg('PropertyAddress','<strong>Error</strong><br />You have entered an invalid email.',2);
  return false;
 }
 if(gender == "") {
  inlineMsg('gender','<strong>Error</strong><br />You must select your gender.',2);
  return false;
 }
 if(discription == "") {
  inlineMsg('message','You must enter a discription.');
  return false;
 }
 if(message.match(messageRegex)) {
  inlineMsg('message','You have entered an invalid message.');
  return false;
 }
 return true;
if(price == "") {
  inlineMsg('price','<strong>Error</strong><br />You must enter the price of the property.',2);
  return false;
 }
 if(!price.match(priceRegex)) {
  inlineMsg('address','<strong>Error</strong><br />You have entered an invalid email.',2);
  return false;
 }
if(area == "") {
  inlineMsg('area','<strong>Error</strong><br />You must enter the area of the property.',2);
  return false;
 }
 if(!area.match(areaRegex)) {
  inlineMsg('area','<strong>Error</strong><br />You have entered an invalid area.',2);
  return false;
 }
}
// START OF MESSAGE SCRIPT //
var MSGTIMER = 20;
var MSGSPEED = 5;
var MSGOFFSET = 3;
var MSGHIDE = 3;
// build out the divs, set attributes and call the fade function //
function inlineMsg(target,string,autohide) {
 var msg;
 var msgcontent;
 if(!document.getElementById('msg')) {
  msg = document.createElement('div');
  msg.id = 'msg';
  msgcontent = document.createElement('div');
  msgcontent.id = 'msgcontent';
  document.body.appendChild(msg);
  msg.appendChild(msgcontent);
  msg.style.filter = 'alpha(opacity=0)';
  msg.style.opacity = 0;
  msg.alpha = 0;
 } else {
  msg = document.getElementById('msg');
  msgcontent = document.getElementById('msgcontent');
 }
 msgcontent.innerHTML = string;
 msg.style.display = 'block';
 var msgheight = msg.offsetHeight;
 var targetdiv = document.getElementById(target);
 targetdiv.focus();
 var targetheight = targetdiv.offsetHeight;
 var targetwidth = targetdiv.offsetWidth;
 var topposition = topPosition(targetdiv) - ((msgheight - targetheight) / 2);
 var leftposition = leftPosition(targetdiv) + targetwidth + MSGOFFSET;
 msg.style.top = topposition + 'px';
 msg.style.left = leftposition + 'px';
 clearInterval(msg.timer);
 msg.timer = setInterval("fadeMsg(1)", MSGTIMER);
 if(!autohide) {
  autohide = MSGHIDE; 
 }
 window.setTimeout("hideMsg()", (autohide * 1000));
}
// hide the form alert //
function hideMsg(msg) {
 var msg = document.getElementById('msg');
 if(!msg.timer) {
  msg.timer = setInterval("fadeMsg(0)", MSGTIMER);
 }
}
// face the message box //
function fadeMsg(flag) {
 if(flag == null) {
  flag = 1;
 }
 var msg = document.getElementById('msg');
 var value;
 if(flag == 1) {
  value = msg.alpha + MSGSPEED;
 } else {
  value = msg.alpha - MSGSPEED;
 }
 msg.alpha = value;
 msg.style.opacity = (value / 100);
 msg.style.filter = 'alpha(opacity=' + value + ')';
 if(value >= 99) {
  clearInterval(msg.timer);
  msg.timer = null;
 } else if(value <= 1) {
  msg.style.display = "none";
  clearInterval(msg.timer);
 }
}
// calculate the position of the element in relation to the left of the browser //
function leftPosition(target) {
 var left = 0;
 if(target.offsetParent) {
  while(1) {
   left += target.offsetLeft;
   if(!target.offsetParent) {
    break;
   }
   target = target.offsetParent;
  }
 } else if(target.x) {
  left += target.x;
 }
 return left;
}
// calculate the position of the element in relation to the top of the browser window //
function topPosition(target) {
 var top = 0;
 if(target.offsetParent) {
  while(1) {
   top += target.offsetTop;
   if(!target.offsetParent) {
    break;
   }
   target = target.offsetParent;
  }
 } else if(target.y) {
  top += target.y;
 }
 return top;
}
// preload the arrow //
if(document.images) {
 arrow = new Image(7,80); 
 arrow.src = "images/msg_arrow.gif"; 
}

please help thank you

[vincevincevince]

You have not told us the actual problem you see; however I can see this immediately:

var PropertyAddress = form.PropertyAddress.value;

formObject.fieldname methods are no longer supported by modern browsers - you need to find the object via the DOM in the conventional way.

[MrFahad]

how can i do that, the problem is that i got this script from a tutorial online and the developer demo works just fine
thanks for help

[vincevincevince]

Let's start with what error you get... which browser do you use? If it's Internet Explorer; try another one - otherwise - let us know the error and we can work from there.

[MrFahad]

no way i use IE :p, i only use FireFox 3
well i get mysql error becuase the javascript is not validating and there is no data.

i get this error:
Property addtion failed.

You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near ' '-1-1', , '' )' at line 4

[MrFahad]

ANY HELP PLEASE ?

[vincevincevince]

Tools -> Error Console

See what you find there

[MrFahad]

Error: Permission denied to call method Location.toString
----------
Error: validate is not defined
Source file: [localhost...]
Line: 1
----------
Error: Permission denied to call method Location.toString

[vincevincevince]

The first and third are unrelated; the 'validate not defined' error is more serious. There shoul dhave been another javascript error on load... (beofre submit)?

[MrFahad]

no, i only get Error: validate is not defined after pressing submit no errors before submitting