more than one ajax, second does not work

[helenp]

Hi,
I have one ajax script working for wich I got help with here.
I am now doing a second ajax script wich is easier than previous on next page, but I cant get it work, and dont understand why.
Not sure if I should put the script together or have separately, as per w3c there should only be one call in a function:
[w3schools.com...]
Suppose that is not the reason why it does not work,
I been adding an alert to see where it fail,
the alert inside Ajax open does not work.
What is failing?
Thanks

function objetoAjax(){
var xmlhttp=false;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
 
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
 
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
 xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}


function enviarDatosSolicitud(){
var divResultado = document.getElementById('resultado');
divResultado.style.display = "block"; 
 var enviarajax = document.solicitud.enviarajax.value,
 idrand = document.solicitud.idrand.value,
 half_round = document.solicitud.half_round.value,
 paynow = document.solicitud.paynow.value,
 balance = document.solicitud.balance.value,
 whenpayment = document.solicitud.whenpayment.value,
 arrive = document.solicitud.arrive.value,
 depart = document.solicitud.depart.value,
 llegada = document.solicitud.llegada.value,
 salida = document.solicitud.salida.value,
 dias = document.solicitud.dias.value;


 ajax = objetoAjax();

 ajax.open("POST", "ajax.php", true);
 ajax.onreadystatechange = function () {
  alert('NO FUNCIONAAAAAAAAAAAAAAAAAAA');
  if (ajax.readyState == 4) {
   if (ajax.responseText === "Loading, please wait") {
    window.location = 'continue.php';
   } else {
    divResultado.innerHTML = ajax.responseText
   <!-- LimpiarCampos();-->
   }
  }
 }
 ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
 ajax.send("dias=" + dias + "&enviarajax=" + enviarajax + "&salida=" + salida + 
    "&llegada=" + llegada + "&depart=" + depart + "&arrive=" + arrive + 
    "&idrand=" + idrand + "&half_round=" + half_round + "&paynow=" + paynow + "&balance=" + balance + "&whenpayment=" + whenpayment + "");
} 

[helenp]

this is the form:

<form class="instant" name="solicitud" id="solicitud" action="<?php echo $_SERVER['SCRIPT_NAME'];?>" method="post" onSubmit="return enviarDatosSolicitud();">
<span style ="font-size:12px">Discount coupon code:</span><input type="text" name="idrand" size="10"> </p>
<input type="hidden" name="propiedad" value="<?php print $propiedad;?>">
<input type="hidden" name="llegada" value="<?php print $llegada;?>">
<input type="hidden" name="salida" value="<?php print $salida;?>">
<input type="hidden" name="dias" value="<?php print $dias;?>">
<input type="hidden" name="half_round" value="<?php print $half_round;?>">
<input type="hidden" name="paynow" value="<?php print $paynow;?>">
<input type="hidden" name="balance" value="<?php print $balance;?>">
<input type="hidden" name="whenpayment" value="<?php print $whenpayment;?>">
<input type="hidden" name="arrive" value="<?php print $arrival_display;?>">
<input type="hidden" name="depart" value="<?php print $departure_display;?>">
<p>
<input class="boton roundedcorner border" type="submit" value= "Proceed with booking using PayPal secure system" name="enviarajax" alt="Instant payment"> </p>
<script type="text/javascript" src="ajaxcupones.js"></script>
<div id="resultado"></div> 
</form>

[helenp]

Doing this the alert is printed but disappears after one second without clicking on accept:

function objetoAjax(){
var xmlhttp=false;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
 
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
 
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
 xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}

function enviarDatoscupon(){
divresult = document.getElementById('result');

enviarajax = document.solicitud.enviarajax.value;
 idrand = document.solicitud.idrand.value;
 half_round = document.solicitud.half_round.value;
 paynow = document.solicitud.paynow.value;
 balance = document.solicitud.balance.value;
 whenpayment = document.solicitud.whenpayment.value;
 arrive = document.solicitud.arrive.value;
 depart = document.solicitud.depart.value;
 llegada = document.solicitud.llegada.value;
 salida = document.solicitud.salida.value;
 dias = document.solicitud.dias.value; 
 ajax = objetoAjax();
 ajax.open("POST", "ajax.php", true);
 ajax.onreadystatechange = function () {
  alert('NO FUNCIONAAAAAAAAAAAAAAAAAAA');
 if (ajax.readyState == 4) {
  if (ajax.responseText === "Loading, please wait") {
  window.location = 'continue.php';
  } else {
  divresult.innerHTML = ajax.responseText
  <!-- LimpiarCampos();-->
  }
 }
 }
 ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
 ajax.send("dias=" + dias + "&enviarajax=" + enviarajax + "&salida=" + salida + 
  "&llegada=" + llegada + "&depart=" + depart + "&arrive=" + arrive + 
  "&idrand=" + idrand + "&half_round=" + half_round + "&paynow=" + paynow + "&balance=" + balance + "&whenpayment=" + whenpayment + "");
} 

Maybe its due to that I had an request on the page before? Or something is wrong, cant see anything

[Fotiman]

First, when posting code on WebmasterWorld, it can be helpful to wrap it in the following tags to preserve some formatting:
[quote][pre][code]
[/code][/pre][/quote]

In your code you have this:
onSubmit="return enviarDatosSolicitud();"

the enviarDatosSolicitud function must have a return statement in it for this to work properly. To prevent the default form action (submitting the form, causing a new document to be loaded), you must "return false;" within your function. As you've posted it above, there is no return method at all in that function, so the form will still submit. And by the time the AJAX response comes back, the document that sent the request has now been replaced, and hence you never see the onreadystatechange function called.

[helenp]

the enviarDatosSolicitud function must have a return statement in it for this to work properly. To prevent the default form action (submitting the form, causing a new document to be loaded), you must "return false;" within your function. As you've posted it above, there is no return method at all in that function, so the form will still submit. And by the time the AJAX response comes back, the document that sent the request has now been replaced, and hence you never see the onreadystatechange function called.

puf,
this is so true,
didnt remember I changed from onclic to onsubmit....
as there is no validation in the form, thought not necesary return false.
so many new things.
I will try and get back.
The other question.
Is it ok to have several ajax scripts, or should be all in one as per w3c?
thanks

pd. I have learnt to add this for loading,
hope its correct, (at least workw as per my tests) as sometimes take some seconds to load:
ajax.onreadystatechange = function () {
if (ajax.readyState==1 || ajax.readyState==2 || ajax.readyState==3)
{
divResultado.innerHTML = 'Please wait...';
}
if (ajax.readyState == 4) {
if (ajax.responseText === "Loading, please wait") {

[helenp]

First, when posting code on WebmasterWorld, it can be helpful to wrap it in the following tags to preserve some formatting:

not sure I got this....

Edited
lol, not sure how you printed that quote, pre, code thing.
Nice picture lol

[helenp]

Adding return false to the end of script, I think made it work,
still needs some tests:

 ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
 ajax.send("dias=" + dias + "&enviarajax=" + enviarajax + "&salida=" + salida + 
  "&llegada=" + llegada + "&depart=" + depart + "&arrive=" + arrive + 
  "&idrand=" + idrand + "&half_round=" + half_round + "&paynow=" + paynow + "&balance=" + balance + "&whenpayment=" + whenpayment + "");
 return false;
} 

[Fotiman]

If you use the "reply to this topic" link instead of the Quick Reply textarea, there is a "Disable codes for this message" checkbox that would allow you to print the quote, pre, code thing like I did. All of the codes you can use in a reply are listed here:
[webmasterworld.com...]

Is it ok to have several ajax scripts, or should be all in one as per w3c?

The link that you shared above says:

If you have more than one AJAX task on your website, you should create ONE standard function for creating the XMLHttpRequest object, and call this for each AJAX task.

This basically just means that since an AJAX request typically consists of a URL (where to send the request) and what to do when the response comes back, you can generalize that into a single function. For example, suppose you had some code that did something like this:

// AJAX request #1
var ajax1 = objectoAjax();
ajax1.open("POST", "page1.php", true);
ajax1.onreadystatechange = function () {
  // Do some stuff
};
ajax1.send("foo=bar");

// AJAX request #2
var ajax2 = objectoAjax();
ajax2.open("POST", "page2.php", true);
ajax2.onreadystatechange = function () {
  // Do some stuff
};
ajax2.send("id=1");

Instead, you could do something like this:

function sendAjax(url, data, callback) {
  var ajax = objectoAjax();
ajax.open("POST", url, true);
ajax.onreadystatechange = callback;
ajax.send(data);
}

// AJAX request #1
sendAjax("page1.php", "foo=bar", function () {
  // Do some stuff
});

sendAjax("page2.php", "id=1", function () {
  // Do some stuff
});

[Fotiman]

Also, where you declare your "ajax" variable, don't forget to use var! Otherwise you're creating a global variable, which in general you should try to avoid. So instead of this in your code above:

ajax = objetoAjax();

Make it this:

var ajax = objetoAjax();

[helenp]

Thanks for everything, If you have more than one AJAX task on your website, you should create ONE standard function for creating the XMLHttpRequest object, and call this for each AJAX task.

So if I understand correctly I should have this for all ajax tasks I have and then all tasks on this same page.
Actually I already have 3 and another 3+3 in another language folder:

function objetoAjax(){
var xmlhttp=false;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
 
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
 
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
 xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}

Then task 1
task 2
task 3
etc.