Dynamicaly change selection box from other selection box 1

[endomorph1]

Please help because this is driving me crazy.

I have a script at the moment which is disabling some selection boxes on changing other selection boxes -


function disableresort(disableIt)
{
document.searchbox.Resort.disabled = disableIt;
}

function disablecountry(disableIt)
{
document.searchbox.Country.disabled = disableIt;
}

function disableweeks(disableIt)
{
document.searchbox.Weeks.disabled = disableIt;
}

function disablemonth(disableIt)
{
document.searchbox.Month.disabled = disableIt;
}

function enableField()
{
document.searchbox.Resort.disabled=false;
document.searchbox.Country.disabled=false;
document.searchbox.Weeks.disabled=false;
document.searchbox.Month.disabled=false;
}

I need to expand this now.

When I run function disableresort (Which is called by selecting an option in "Country", I need to change other selection boxes.

In selection box called "Country", if the option (with value POINT, option number 3) is selected, I need to empty the selection box called "Weeks" and create one single option called POINTS which has a value of POINTS.

I also need to disable a selection box called MONTHS and a selection box called SIZE.


In selection box called "Country", if the option (with value VACL, option number 2) is selected, I need to empty the selection box called "Weeks" and create one single option called FLOATING which has a value of FLOATING.

I also need to disable a selection box called MONTHS.

Any help is greatly appreciated. Thanks

 

[feherke]

Hi

Do not expect to rebuild your HTML document. As you did not gave use complete code to work on, my code may not match your needs.

<script type="text/javascript">
function ch()
{
  ds=document.searchbox;
  ds.months.disabled=ds.country.selectedIndex==1 || ds.country.selectedIndex==2;
  ds.size.disabled=ds.country.selectedIndex==2;
  if (ds.months.disabled) while (ds.weeks.options.length) ds.weeks.options[ds.weeks.options.length-1]=null;
  if (ds.country.selectedIndex==1) ds.weeks.options[0]=new Option('FLOATING','FLOATING');
  if (ds.country.selectedIndex==2) ds.weeks.options[0]=new Option('POINTS','POINTS');
}
</script>

[gray]<!-- ... -->[/gray]

<form name="searchbox">

<select name="country" onchange="ch()">
<option value="1">one</option>
<option value="VACL">VACL</option>
<option value="POINT">POINT</option>
</select>

<select name="weeks">
<option value="one">one</option>
<option value="two">two</option>
<option value="three">three</option>
</select>

<select name="months">
<option value=""></option>
</select>

<select name="size">
<option value=""></option>
</select>

</form>

Feherke.

http://rootshell.be/~feherke/

 

[endomorph1]

Thanks feherke, your a god ! With a little tweeking, it works spot on. Tjis was the end code.

{
document.searchbox.Resort.disabled = disableIt;

ds=document.searchbox;
ds.Month.disabled=ds.Country.selectedIndex==1 || ds.Country.selectedIndex==2;
ds.Size.disabled=ds.Country.selectedIndex==1;
if (ds.Month.disabled) while (ds.Weeks.options.length) ds.Weeks.options[ds.Weeks.options.length-1]=null;
if (ds.Country.selectedIndex==2) ds.Weeks.options[0]=new Option('Floating','FLOATING');
if (ds.Country.selectedIndex==1) ds.Weeks.options[0]=new Option('Points','Points');
}


Now if I could trouble you for one more ;-)

I need to do basically the same with the points (not the floating) but if I choose one of a choice of resorts.

So -

if resort = resortname 1 then disable country & month and empty weeks of all options and create one option with a value of points.

if resort = resortname 2 then disable country & month and empty weeks of all options and create one option with a value of points.

if resort = resortname 3 then disable country & month and empty weeks of all options and create one option with a value of points.

The list of resort names is around 50. Unfortunatly it cannot be done by index value as the option list is created dynamically from a database.

BTW, if you want to see where this is working, go to

http://www.travelandleisuregroup.co.uk.

It is the search box at the bottom.
(Admin - Sorry if I should not post URL's - please remove)

 

[endomorph1]

Ooops ! Few errors there. Where is the edit post button ?

Should read -

Thanks feherke, your a god ! With a little tweaking, it works spot on. This was the end code -

{
document.searchbox.Resort.disabled = disableIt;

ds=document.searchbox;
ds.Month.disabled=ds.Country.selectedIndex==1 || ds.Country.selectedIndex==2;
ds.Size.disabled=ds.Country.selectedIndex==1;
if (ds.Month.disabled) while (ds.Weeks.options.length) ds.Weeks.options[ds.Weeks.options.length-1]=null;
if (ds.Country.selectedIndex==2) ds.Weeks.options[0]=new Option('Floating','FLOATING');
if (ds.Country.selectedIndex==1) ds.Weeks.options[0]=new Option('Points','Points');
}


Now if I could trouble you for one more

I need to do basically the same with the points (not the floating) but if I choose one of a choice of resorts.

So -

if resort = resortname 1 then disable country, size & month and empty weeks of all options and create one option with a value of points.

if resort = resortname 2 then disable country, size & month and empty weeks of all options and create one option with a value of points.

if resort = resortname 3 then disable country, size & month and empty weeks of all options and create one option with a value of points.

The list of resort names is around 50. Unfortunatly it cannot be done by index value as the option list is created dynamically from a database.

BTW, if you want to see where this is working, go to

http://www.travelandleisuregroup.co.uk.

It is the search box at the bottom.
(Admin - Sorry if I should not post URL's - please remove)

 

[endomorph1]

If it helps, when I create the option list, I can give the resorts a id=

 

[feherke]

Hi

Then keep those ~50 names in an [tt]Array[/tt] :

resl=new Array(
  'resortname 1',
  'resortname 2',
  [gray]// ...[/gray]
  'resortname 50'
);

function chr()
{
  ds=document.searchbox;
  resv=ds.Resort.options[ds.Resort.selectedIndex].text;
  resf=false;
  for (i=0;i<resl.length;i++) if (resl[i]==resv) resf=true;
  ds.Country.disabled=resf;
  ds.Month.disabled=resf;
  if (resf) {
    while (ds.Weeks.options.length) ds.Weeks.options[ds.Weeks.options.length-1]=null;
    ds.Weeks.options[0]=new Option('Points','POINTS');
  }
}

Feherke.

http://rootshell.be/~feherke/

 

[feherke]

Hi

If it helps, when I create the option list, I can give the resorts a id=""

Do you mean :

<select name="Resort">
<option>nope<option>                 [gray]<!-- do nothing -->[/gray]
<option id="1">resortname 1<option>  [gray]<!-- disable, empty, fill -->[/gray]
<option>neither</option>             [gray]<!-- do nothing -->[/gray]
<option id="2">resortname 2<option>  [gray]<!-- disable, empty, fill -->[/gray]
</select>

That is possible, but personally I would prefer with [tt]class[/tt], because the [tt]id[/tt]s should be unique :

<select name="Resort">
<option>nope<option>                     [gray]<!-- do nothing -->[/gray]
<option class="do">resortname 1<option>  [gray]<!-- disable, empty, fill -->[/gray]
<option>neither</option>                 [gray]<!-- do nothing -->[/gray]
<option class="do">resortname 2<option>  [gray]<!-- disable, empty, fill -->[/gray]
</select>

That would simplify the JavaScript code to no array :

function chr()
{
  ds=document.searchbox;
  resf=ds.Resort.options[ds.Resort.selectedIndex].className=='do';
  ds.Country.disabled=resf;
  ds.Month.disabled=resf;
  if (resf) {
    while (ds.Weeks.options.length) ds.Weeks.options[ds.Weeks.options.length-1]=null;
    ds.Weeks.options[0]=new Option('Points','POINTS');
  }
}

Feherke.

http://rootshell.be/~feherke/

 

[endomorph1]

Once again, you da man !

Glad you came up with the second option which I did. Works brilliant. Thanks so much for that.

 

[endomorph1]

Feherke,

Remember this/me ? Either something has gone wrong or I missed something out when we did this.

The final code I had was -

function disablecountry(disableIt)
{
document.searchbox.Country.disabled = disableIt;

{
ds1=document.searchbox;
resf=ds1.Resort.options[ds1.Resort.selectedIndex].className=='POIN';
ds1.Country.disabled=resf;
ds1.Month.disabled=resf;
ds1.Size.disabled=resf;
if (resf) {
while (ds1.Weeks.options.length) ds1.Weeks.options[ds1.Weeks.options.length-1]=null;
ds1.Weeks.options[0]=new Option('Points','Points');
}
}
}


But it is not doing the -

document.searchbox.Country.disabled = disableIt;

If I change the resort to a non class ID selection.

The whole script file can be got from -

http://www.travelandleisuregroup.co.uk/scripts/searchvalidation.js

if you need it.

Thanks again

 

[feherke]

Hi

And the related HTML document is the site's main page, right ?

Well, you call it as [highlight #eee][tt]disablecountry(this.selectedIndex)[/tt][/highlight] , so it will receive a numeric parameter from the [tt]selectedIndex[/tt] property. But you attach it to a [tt]disabled[/tt] property, which is boolean.

Not sure if that is the problem, but looks strange. For now.

Feherke.

http://rootshell.be/~feherke/

 

[endomorph1]

If you look at all the other functions in the file, they are very much the same and they work fine, it is just this one.