freaking third party site Java Scripts again...

iaweb2 17 Jul, 2009
As Max and Greyhead were so gracious to help me through my previous form issues with a third party site javascripts, I am coming back with the next one as I can not make it work again... different site though...

Ok, here we go:

The form needs to call up a Javascript which is supplied by the booking engine provider (see attachment) and than through an onload function it needs to be started in order to fill up the arrival date and perform some verifications...

So, here is my problem, when I load the page I get error messages from the JS froms as follows:

Message: 'document.ChronoContact.my_form' is null or not an object
Line: 50
Char: 1
Code: 0
URI: http://d9992491.u139.iaweb.biz/

Message: Object expected
Line: 1070
Char: 1
Code: 0
URI: http://d9992491.u139.iaweb.biz/

Message: 'document.idForm.fromyear' is null or not an object
Line: 418
Char: 1
Code: 0
URI: http://d9992491.u139.iaweb.biz/


Ok, here is what I did:

1) I created the form with the fields as per the instructions from the third party provider
2) I took the whole .JS file and copied it into the FORM JAVASCRIPT field of my form
3) I remembered that Chronoforms adds something to the form name so therefore I added to this Javascript form as well the following code:
 var form =  document.ChronoContact.my_form; 
to account for the different form name
4) I added the following line to the index.php of the template I am using
<body id="bd" onload="start();"> 
in order to start the JS inside the form...

Problem is now, the arrival date is not filled up, the verifications do not work and the form action is not recognized .... so, pretty much nothing works...

Anybody with any ideas is highly welcome to share them with me...

Thanks a million as always



Heiko

PS: Max, if we get this working there is the second purchase of a license, hehehehe....
GreyHead 18 Jul, 2009
Hi iaweb2,

You were correct that the name changes - but you got the wrong name (the right version is visible in the <form . . .> tag if you look at the page source. In this case it will be ChronoContact_my_form

Bob
iaweb2 18 Jul, 2009
Hi Bob:

first of all thanks as alwaus for helping me out, now just to make sure I understood this correct
instead if the variable
var form =  document.ChronoContact.my_form; 


I should use??

var form =  document.ChronoContact_my_form; 


Could that little thing be the only mistake I made? That would be fantastic and unusual for me😀

I will try it out and report back.

Thank you very much,


Heiko
GreyHead 19 Jul, 2009
Hi heiko,

Yes, that's it, I can't promise it's the only mistake though . . . :-)

Bob
iaweb2 19 Jul, 2009
Hey Bob:

Here my report back...

The change removed one of the errors on the site and partially made the form workable.
Now clicking the "Submit" button, opens actually the correct site (however in the main window instead of the pop-up window, which comes up empty), but the arrival dates are not filled and therefore I still get the error messages on the third party site... so somehow the onload command calls before the form is loaded??? Is that possible?

This is the remaining error I see (was able to get rid of the other error as well after changing some things on the form code):


Message: 'document.idForm.fromyear' is null or not an object
Line: 417
Char: 1
Code: 0
URI: http://d9992491.u139.iaweb.biz/


Any further advice or help is as always very appreciated...

Thanks,


Heiko
GreyHead 20 Jul, 2009
Hi iaweb2,

That looks like a similar ptoblem it should probably be form.fromyear as you've defined the form variable.

Bob
iaweb2 20 Jul, 2009
Hi Bob:

Thanks for the advice, but I am so crappy with Javascript that I do not really know what to enter now ...

I tried to add this:

var form.fromyear =  document.ChronoContact_my_form.fromyear;


But that brought me just more error messages... so as said, not really sure which var to add to the Javascript code box...

Message: Expected ';'
Line: 52
Char: 9
Code: 0
URI: http://d9992491.u139.iaweb.biz/


Message: Object expected
Line: 552
Char: 1
Code: 0
URI: http://d9992491.u139.iaweb.biz/


So, I am pretty sure that this was wrong😟

Thanks



Heiko
GreyHead 20 Jul, 2009
Hi iaweb2,

document refers to the whole web page; so document.idForm refers to the idForm element within the page. This was for the original form with <form id="idForm" . . .

Now the form id is ChronoContact_my_form so the equivalent reference would be document.ChronoContact_my_form but, to make life simpler you have defined a JavaScript variable (var) var form = document.ChronoContact.my_form;

From here on you can use form in place of document.ChronoContact.my_form so to access the fromyear element of the form you can use form.fromyear

Simplified a bit but that should help you to the next step.

Bob
iaweb2 20 Jul, 2009
Hi Bob:

Thanks for the explanation, but unfortunately you gave me far too much credit by thinking that I would know what I am doing...

After reading what you wrote I tried to replace all references to document.idForm.fromyear with document.form.fromyear as well as just form.fromyear but both somehow do not work and just bring than the error message with the replaced string ...

Seriously I have no clue, as I did not write the Javascript (came from the Booking Engine provider) and they give only instructions to implement it via a regular coded static website, instead of Joomla+Chronoforms ...

So, I am actually quite lost....

Thanks


Heiko
nml375 26 Jul, 2009
Hi,
Had a look at the current status of the page.
First off, the definition of "form" fails, as you do not use the right id. It should be like this:
var form = document.ChronoContact_reservationen;

What Bob meant, was that you should have replaced "my_form" with the actual name of the form as seen in CF backend manager.

Next, you should replace your "document.idForm" with "form".

As such, your build_year_select should look something like this instead (you'll have to fix the rest of the functions as well):
function build_year_select() {
  var cur_date = new Date();
  var cur_year = takeYear(cur_date);
  cur_y = new Option(cur_year, cur_year, true, true);
  form.fromyear.options[0] = cur_y;
  if (form.toyear != null) {
    cur_yb = new Option(cur_year, cur_year, true, true);
    form.toyear[0] = cur_yb;
  }
  next_y = new Option(cur_year + 1, cur_year + 1, false, false);
  form.fromyear.options[1] = next_y;
  if (form.toyear != null) {
    next_yb = new Option(cur_year + 1, cur_year + 1, false, false);
    form.toyear.options[1] = next_y;
  }
}


/Fredrik
iaweb2 26 Jul, 2009
Dear Fredrik:

Thanks a million for the help, will start going through and report back...


Heiko
iaweb2 26 Jul, 2009
Hello Fredrik:

I made all the changes to the script but get now a different error message which seams to point now to the "form"

Please see below

Message: 'form.fromyear' is null or not an object
Line: 418
Char: 1
Code: 0
URI: http://d9992491.u139.iaweb.biz/


Thanks,


Heiko
nml375 26 Jul, 2009
Hi,
This actually looks like a run order problem. The 'form' declaration is done before the form has actually been created/loaded. From what I can gather, you've got an onload event that calls start(); this would probably be a good idea to set the value of 'form'. To make things a little more complicated however, we need to declare the variable outside that function though...

Give this a shot:
var form;
...
function start() {
  form = document.ChronoContact_reservationen;
  var nbm = [ 31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31 ];
...


/Fredrik
iaweb2 26 Jul, 2009
Dear Fredrik:

Thanks for the tip and you are correct, the onload start event is supposed to start the whole process...

Now my question, the code you posted goes inside the Javascript Code or inside my index.php where the onload command is?

Thanks



Heiko
nml375 26 Jul, 2009
That should go wherever you've already got your start function, pretty much the same place as where you've got 'var form = document.ChronoContact_reservationen;'.

... means "some other code here"

/Fredrik
iaweb2 26 Jul, 2009
Dear Fredrik:

Nevermind the last post, I figured it out....

And now with this change the date is properly filled up in the form - thanks a million for that -, however somehow the form still opens in the same window (eventhough it opens the pop-up window but empty) and the data from the form is not submitted to the third party site and therefore I get no correct data from this site..


Thanks,


Heiko
nml375 26 Jul, 2009
Hi Heiko,
Now we're dealing with a little more complex things..
The first step of business however, would be to give your form a new target window. This would have to be done within the 'hhotelFormValidation()' function, which is responsible for opening the new window. This should do that trick:
function hhotelFormValidation(myForm, mandatoryCode){
  if (mandatoryCode == 1 && myForm.AccessCode.value == "") {
    alert("You must type in your code ID");
    return (false);
  }
  var languetype = typeof myForm.action;
  myForm.action = FBRESA + "dispoprice.phtml";
  window.open('','dispoprice', 'toolbar=no,width=800,height=550,menubar=no,scrollbars=yes,resizable=yes');
  myForm.target = 'dispoprice';
  myForm.submit();
  return (true);
}


/Fredrik
iaweb2 26 Jul, 2009
Hey Fredrik:

You are a master of your trade, thank you ...... (I wish I had a clue what you were doing here, I try to learn but somehow that is all greek to me😢 )

The window opens now with the correct website, however the form data seems not to be transferred, or the hotelnames have a problem, as the following error message


Message: 'Hotelnames' is null or not an object
Line: 315
Char: 2
Code: 0
URI: http://d9992491.u139.iaweb.biz/



Thanks,



Heiko
nml375 26 Jul, 2009
Hi Heiko,
Thanks, best way of learning, imho - is to look at simple examples, trying to extend/modify them, breaking them, and then fixing them😉 + There are tons of good and bad examples on the net. Unfortunately, it takes some experience to start thinking "programming", but keep trying and you'll get there sooner or later..

This error is because the form field is actually named "HotelNames", not "Hotelnames". JScript and the DOM is rather kinky about case. Either edit the form and change the id to "Hotelnames", or edit every occurrence of "Hotelnames" into "HotelNames" in your script(s).

/Fredrik
iaweb2 26 Jul, 2009
Hey Fredrik:

Yiiiiiiipeeeeeeeeeeeeeeee, it worked like a charm, I owe you big one...

Thanks for the help, it for whatever reason happens everytime I need to work with a third party site, all my forms on the site itself are always working sooo easy, hehehehe

Anyway, again thank you very much for the huge help.


Heiko
This topic is locked and no more replies can be posted.