interactive webform

[steve1978]

Hi there,

I'm looking for some example code to help me along the way.

I'm using Joomla 2.5.8 with aicontactsafe.
In the webform I would like to use an interactive webform.

I have 3 fields which are interessting to build.

Field 1)Country
Field 2)Type request: registration, basic, credit
Field 3)Speed request: immediate, normal, express, flash

1ste example:
First I choose a country, let's say Armenia.
Then I choose basic. Finaly I see only immediate and flash as an option.

2nd example:
First I choose a country, Russia.
Then I choose credit. Finaly I can choose between all speeds: immediate, normal, express, flash

So you see the 1ste choice defines, country, defines the choises I have in the request type field and this choice defines the speed request.

Are there any examples available to build my own webform?

Last thing though. I also want to show the price of my choise below in the form.
Is this possible?

Br,

Steve

[daveVk]

No knowledge of Joomla

Do not assume fields will always be filled in correct order.

3rd example
Russia,credit,express,Armenia

Either ask in sequence Or after any change mark invalids in red.

[steve1978]

Hi Dave,

Thanks for your reply.

It would be an idea to use sequence in filling the form.

Country, type request, speed request.

Do you have an example of a script to use?

Br,

Stevan

[daveVk]

OK Stevan and welcome to forum,

Can you post the code you would use ignoring dependencies ? It may give a clue as to how Joomla and aicontactsafe are involved.

You will also need a function that takes the current Country and Type values and produces lists of validTypes and validSpeeds.

[steve1978]

Hi Dave,

Thank you.
I must admit I'm not a programmer so I hope I understand.

Anyway. I switched to another webform extension within Joomla.
I'm using Breezingforms which gives more freedom to use code.

This is the testsite:
[is.enigma-webdesign.nl ]

Here goes:

Country:
------------------------------
name:CselRegion

Action script:

function ff_CselRegion_action(element, action)
{
 country = ff_getElementByName('CselCountry');
 state = ff_getElementByName('CselState');

 var armeniaArray = new Array('Registration', 'Basic', 'Credit');

 var azerbaijanArray = new Array('Registration', 'Basic', 'Credit');

 var belarusArray = new Array('Registration', 'Basic', 'Credit');

 var bosniaArray = new Array('Registration', 'Basic', 'Credit');

 var bulgariaArray = new Array('Registration', 'Basic', 'Credit');

 var croatiaArray = new Array('Registration', 'Basic', 'Credit');

 var czechrepublicArray = new Array('Registration', 'Basic', 'Credit');

 var latviaArray = new Array('Registration', 'Basic', 'Credit');

 if (element.value == 'none') {
  // drop countries
  while (country.options.length > 0)
   country.options[country.options.length-1] = null;
 } else {
  // get the matching array
  var selectedArray = eval(element.value+'Array');

  // drop supernumerous option
  while (selectedArray.length < country.options.length-1)
   country.options[country.options.length-1] = null;

  // add the new options
  country.options[0] = new Option('Selecteer type rapport', 'none', true, true);
  for (var i=0; i < selectedArray.length; i++)
   country.options[i+1] =
    new Option(selectedArray[i], selectedArray[i]);
 } // if

 // drop states
 while (state.options.length > 0)
  state.options[state.options.length-1] = null;
} // ff_CselRegion_action

Validate script:
function ff_CselRegion_validation(element, message)
{
 if (element.value=='none') {
  if (message=='') message = "Please select region.\n";
  ff_validationFocus(element.name);
  return message;
 }
 return '';
}

Type request:
------------------------------
name:CselCountry

Actionscript:

function ff_CselCountry_action(element, action)
{
 state = ff_getElementByName('CselState');

 var stateArray = new Array('immediate', 'normal', 'express', 'flash');
 if (element.value=='Registration') {
  // drop supernumerous option
  while (stateArray.length < state.options.length-1)
   state.options[state.options.length-1] = null;

  // add the new options
 state.options[0] = new Option('Selecteer snelheid', 'none', true, true);
  for (var i=0; i < stateArray.length; i++)
   state.options[i+1] = new Option(stateArray[i], stateArray[i]);
 } else {
  while (state.options.length > 0)
   state.options[(state.options.length - 1)] = null;
 } // if
} //ff_CselCountry_action

Validationscript:

function ff_CselCountry_validation(element, message)
{
 if (element.value=='none' || element.value=='') {
  if (message=='') message = "Please select country.\n";
  ff_validationFocus(element.name);
  return message;
 }
 return '';
}

Speed Request:
------------------------------
name: CselState

Validationscript:

function ff_CselState_validation(element, message)
{
 if (ff_getElementByName('CselCountry').value=='USA')
  if (element.value=='none' || element.value=='') {
   if (message=='') message = "Please select state.\n";
   ff_validationFocus(element.name);
   return message;
  }
 return '';
}

As you can see it's only set to validate but I want to show the pricing.

Currently I was only to get so far showing the countries and type request but I'm not sure how to continue.
What I want is to give speed request a value to show (euro field) depenand on the choice of Country you make.

I hope this helps a bit.

Br,

Stevan

[daveVk]

That looks promising.

The big picture is whenever Country, Type, Speed or other fields that effect price change, call a function similar to ff_CselRegion_action that
- recalculates valid type and speed option, say validTypes and validSpeeds arrays.
- updates options array on type(speed) selectors per validTypes(speeds).
- if current type(speed) not in valid... set to 'none'.
- if have data on all fields needed to calculate price, calculate it.
- update element where price is displayed with calculated price or blank value.

The individual field action functions will then have little else to do.

Hope that helps

[steve1978]

Hi Dave,

You described exactly what I want to do.

Now all I need is an example script based on 2 countries.

Is there any way you could think with me to build a testscript based on this?

I'm not a programmer and looking up via Google is taking too long.

I can think with you and test the scripts. Just need some pointers as an example.

Br,

Stevan