Hello,

I'm having a problem understanding why would a form I built before would stop working now. Basically I have some javascript functions that are being called in a reservation form with 2 buttons.

This is the JS code:

var bgMemory;	// save color information
var fgMemory;
var 	statusinfo = false;
function mOver(cell, id, statustxt)
{
     
      cell.style.cursor = 'hand';
      cell.style.backgroundColor='#e6e6e6';
	if (typeof document.getElementById(id + "cc") == "object")
	{
		Elem = document.getElementById(id + "cc");
		bgMemory = Elem.style.backgroundColor;
		Elem.style.backgroundColor='#e6e6e6';
	}
	if (typeof document.getElementById(id + "l") == "object")
	{
		Elem = document.getElementById(id + "l");
		fgMemory = Elem.style.color;
		Elem.style.color='#3D6484';
	}
	window.status=statustxt;
	statusinfo = true;
	return true;
}
function mOut(cell, id)
{
     
      cell.style.cursor = 'hand';
      cell.style.backgroundColor='';
      window.status="";
	if (typeof document.getElementById(id) == "object")
	{
		Elem = document.getElementById(id + "cc");
		Elem.style.backgroundColor = bgMemory;
	}
	if (typeof document.getElementById(id + "l") == "object")
	{
		Elem = document.getElementById(id + "l");
		Elem.style.color = fgMemory;
	}
	window.status='';
	statusinfo = false;
	return true;
}
function mClick(cell)
{
   if(event.srcElement.tagName=='TD')
   {
      cell.children.tags('A')[0].click();
   }
}
</script>
<script type = "text/javascript">
var xMonths = new Array( 'jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec' );

function getListValue( option_object ) {
   return option_object.options[option_object.selectedIndex].value;
}

function setListValue( option_object, value  ) { option_object.selectedIndex = value; }

function addDays(myDate,days) {
    return new Date(myDate.getTime() + days*24*60*60*1000);
}
function init()
{
xToday = new Date();
yToday = addDays(new Date(),3);

xMonth = xToday.getMonth();
xDay = xToday.getDate()-1;
xYear = xToday.getYear()-2005; if (xYear < 2005) xYear=0;

yMonth = yToday.getMonth();
yDay = yToday.getDate()-1;
yYear = yToday.getYear()-2005; if (yYear < 2005) yYear=0;
  xF = document.forms['quickbooking'];
  setListValue( xF.ETAHour, 9 )
  setListValue( xF.ETAMonth, xMonth )
  setListValue( xF.ETADay, xDay )
  setListValue( xF.ETAYear, xYear )
  setListValue( xF.ETTHour, 9 )
  setListValue( xF.ETTMonth, yMonth )
  setListValue( xF.ETTDay, yDay )
  setListValue( xF.ETTYear, yYear )
}


function openhelp( hlpString )
{
    hlpWin = window.open( hlpString , 'Help', 'width=395,height=345,resizable=yes,scrollbars=yes,status=yes')
    hlpWin.focus();
}

function doContinue( )
{
xF = document.forms['quickbooking'];
xETADay = getListValue( xF.ETADay );
xETAMonth = getListValue( xF.ETAMonth );
xETAYear = getListValue( xF.ETAYear );
xETAHour = getListValue( xF.ETAHour );
xETAMinute = getListValue( xF.ETAMinute );
xETA = xETADay + xMonths[ parseInt( xETAMonth )-1 ] + xETAYear.substr(2,2) + '/' + xETAHour + xETAMinute;xETTDay = getListValue( xF.ETTDay );
xETTMonth = getListValue( xF.ETTMonth );
xETTYear = getListValue( xF.ETTYear );
xETTHour = getListValue( xF.ETTHour );
xETTMinute = getListValue( xF.ETTMinute );
xETT = xETTDay + xMonths[ parseInt( xETTMonth )-1 ] + xETTYear.substr(2,2) + '/' + xETTHour + xETTMinute;
xWizardNumber = xF.wizard_number.value;
xName = xF.surname.value ;
xRL_Country = xF.Country.value ;
xParams = '&CTR=' + xCountry +'&Country=' + xCountry + '&ETA=' + xETA + '&ETT=' + xETT+ '&CNAM=' + xName + '&WIZ=' + xWizardNumber+'&SOR=0038780x';
url = 'http://book.rent-at-avis.com/avisonline/ibe.nsf/PrefillX?OpenAgent&ResStep=ReservationStep1&IBEOwner=EU&LNG=GB' + xParams;location.href = url;
}
window.onload = init;

And this is the 2 buttons of the form:

<FORM name=quickbooking action=javascript:doContinue(); method=post>
<input class="formButton" id="more_options" onclick="doContinue();" type="button" value="More options" name="more_options" />
              <input class="formButton" id="continue" onclick="doContinue();" type="button" value="Continue" name="continue" selected="selected" />

The "More Options" button is working fine but when I enter my email and click on "Continue" it doesn't do anything, if I leave the email field blank and click continue it works but poping the alertbox... Help would be really appreciated, thank you.

I just realized that if you goto the page http://www.avis.com.lb/ and you view the page's source, you'll notice in the javascript that there are 2 email validation functions and none of them is present in the actual file code (reservation-form.html)... I don't know where are they coming from.

Sorry, but your scripts do exactly what you wrote. There is no submit() command nor SUBMIT button, hence no reason to do the <FORM action="....">
Try to write less decorative but more functional test page with simple form and either submit() methde either SUBMIT button. :-)

Sorry, I might have been misleading in my previous posts, but I figured out what the real problem is.

URL: http://www.avis.com.lb (check the form on the main page)

The problem is with the email field validation, I removed it and the form seems to be working fine.

My question is, I really need to have the email validation working, so what's the best way to do this?
Keep the 2 functions doContinue() and validemail() seperated and then call them with onclick="return docontinue() && validemail();" or merge the 2 functions and call them with 1 value onclick="docontinue()".

However, I tried both ways and none of them worked with coz I would really appreciate your help in here... :(

Yes I must stay on my previous response
- either finish the doContinue() function with somthing like: this.form.submit()
- either use the type="SUBMIT" instead of type="BUTTON"

And cut off the lines which disables the error warning in ought to debbug easy your code.

I really saw the fullcoloured AVIS page. :-)

- either finish the doContinue() function with somthing like: this.form.submit()

That didn't work.

- either use the type="SUBMIT" instead of type="BUTTON"

This also didn't work, I change the type to SUBMIT and I added an ONCLICK as well: onclick="return validemail() && doContinue();"

And still it wouldn't work.... It keeps asking me to enter an email whether I enter one or leave it blank.

And thanks alot for your help.

Well, then the RegExp must be wrong. Try it separately. There is plenty of email validation examples. When I put this into my Kate text editor it does not find any email address. Try to delete the last $ (dollar sign)

Well, then the RegExp must be wrong. Try it separately. There is plenty of email validation examples. When I put this into my Kate text editor it does not find any email address. Try to delete the last $ (dollar sign)

What last dollar sign?

Just a question, let's say I have 2 functions: docontinue() and emailvalidation() and I'm trying to call them with the onclick. So would this be correct:

onclick="return validemail() && doContinue();"

Or this

onsubmit = "return (validateEmail() && doContinue())"

In the validateEmail() function there is a RegExp definition /^([a-z0-9])([\w\.\-\+])+([a-z0-9])\@(([\w\-]?)+\.)+([a-z]{2,4})$/i
which, I suppose, does not work correctly. It could be very useful if you test this RegExp or the whole function validateEmail() separately.

The $ in Regular Expression means the end of text row but may be not good in text input.

It could be a good idea to write a small test page for testing each functionality of such complex page. Your page for example allows uset to fill in the date of Februar 31 ! this must be also validate or disallowed.

Sorry, I did not note the location.href command, which is used instead of submit(). It seems to me to be more complicated than by using the standard methods. Also the methode="post" is better for transfer of data to server. The doContinue() is doing that what normal form.submit() does itself.

I can also advice to do the validation of email and other user input immediately after the user finished it. So e.g.: <input name="email" onBlur="this.value=validateEmail(this.value)"> and the validation function can check and repair the user input, or <select name="day" onChange="validateDate(this)">

It is very dangerous to simply copy/paste some code you do not know what and how exactly work.

This article has been dead for over six months. Start a new discussion instead.