Board index » jscript

All times are UTC



 Need assistance with a complex drop down navigation 
Author Message
Scot
#1 / 5
 Need assistance with a complex drop down navigation

Hello All,

I am in need of some debugging assistance. I have been working with this
script that will allow me to select a navigational jump from the combination
of 2 drop down menus. Ah but theres a twist, isn't there always in this
business, it needs to have the options of the second drop be dependant on
what was selected in the first. I've been able to do this kinda, but I have
found a couple of bugs and I don't know where else to turn.

Bug 1 (these are not in any real order)

If you select a combination and submit it and arrive at your selected page
and then for some reason you decide to click the back button to go back to
select a different combination you see that the combination you selected
before is messed up. The option in the first drop is still selected but the
contents of the second drop are missing. In their place is a blank selection
box with nothing to select. If you select a different option in the first
box and then return to your first selection the contents of the second drop
return. There has to be a way to fix this so that the options are always
visible and selectable.

Bug 2

I have added some basic error handling to correct if someone selects an
option from the first drop but does not select an option from the second
option before they hit the submit button and receive an error message alert
box. This works fine but I am finding that the page refreshes itself after I
click ok on the alert box. I tried to correct this by adding:
TermProgram = "Yes"

if (TermProgram == "Yes"){return false}

it did stop the page from refreshing but it also stopped the drop down
navigation jump to work too. Any ideas?

Bug 3

This isn't really a bug but a question. After you select your combination
and go to the page you wanted to reach the path in the address bar shows the
field names and the values within it. Is there a way to hide this?

I know this is a lot but I'm stuck and I'm running out of time to get this
project done.

<% Option Explicit %>
<% Response.Buffer = true %>
<html>
<head>
<title>HP Cleaning Kit Program</title>
<style rolloverstyle>A:hover {color: #FF9900}
</style>

<script language="Javascript">
function SelCountryLang(Field)
{
 var CountrySel=Field.options[Field.selectedIndex].value
 var LangSel = document.forms[0].language

 if(CountrySel == " ")
  {
   LangSel.options.length = 0
   LangSel.options[0] = new Option("Select A Language" , "00")
  }

 if(CountrySel == "Arg")
  {
   LangSel.options.length = 0
   LangSel.options[0] = new Option("Select A Language" , "00")
   LangSel.options[1] = new Option("Spanish" , "02")
   LangSel.options[2] = new Option("English" , "01")
  }

   if(CountrySel == "Bzl")
  {
   LangSel.options.length = 0
   LangSel.options[0] = new Option("Select A Language" , "00")
   LangSel.options[1] = new Option("Portuguese" , "04")
   LangSel.options[2] = new Option("Spanish" , "02")
   LangSel.options[3] = new Option("English" , "01")
  }

   if(CountrySel == "Chl")
  {
   LangSel.options.length = 0
   LangSel.options[0] = new Option("Select A Language" , "00")
   LangSel.options[1] = new Option("Spanish" , "02")
   LangSel.options[2] = new Option("English" , "01")
  }

   if(CountrySel == "Col")
  {
   LangSel.options.length = 0
   LangSel.options[0] = new Option("Select A Language" , "00")
   LangSel.options[1] = new Option("Spanish" , "02")
   LangSel.options[2] = new Option("English" , "01")
  }

 if(CountrySel == "Peru")
  {
   LangSel.options.length = 0
   LangSel.options[0] = new Option("Select A Language" , "00")
   LangSel.options[1] = new Option("Spanish" , "02")
   LangSel.options[2] = new Option("English" , "01")
  }

 if(CountrySel == "Ven")
  {
   LangSel.options.length = 0
   LangSel.options[0] = new Option("Select A Language" , "00")
   LangSel.options[1] = new Option("Spanish" , "02")
   LangSel.options[2] = new Option("English" , "01")
  }

Quote:
}

function SelDestination(Form)
{
 var CountrySel =
Form.country.options[Form.country.options.selectedIndex].value
 var LangSel =
Form.language.options[Form.language.options.selectedIndex].value

 if (CountrySel == " " && LangSel == "00" )
    {alert("You need to select a Country and Language before you can
proceed")}

 if (CountrySel == "Arg" && LangSel == "00" )
    {alert("You need to select a language before you can proceed") ;
TermProgram = "Yes"}
 if (CountrySel == "Arg" && LangSel == "02" )
    {document.forms[0].action = "../argentina/" ; TermProgram = "Yes"}
 if (CountrySel == "Arg" && LangSel == "01" )
    {document.forms[0].action = "../argentina/" ; TermProgram = "Yes"}

 if (CountrySel == "Bzl" && LangSel == "00" )
    {alert("You need to select a language before you can proceed")}
 if (CountrySel == "Bzl" && LangSel == "04" )
    {document.forms[0].action = "../brazil/"}
 if (CountrySel == "Bzl" && LangSel == "02" )
    {document.forms[0].action = "../brazil/"}
 if (CountrySel == "Bzl" && LangSel == "01" )
    {document.forms[0].action = "../brazil/"}

 if (CountrySel == "Chl" && LangSel == "00" )
    {alert("You need to select a language before you can proceed")}
 if (CountrySel == "Chl" && LangSel == "02" )
    {document.forms[0].action = "../chile/"}
 if (CountrySel == "Chl" && LangSel == "01" )
    {document.forms[0].action = "../chile/"}

 if (CountrySel == "Col" && LangSel == "00" )
    {alert("You need to select a language before you can proceed")}
 if (CountrySel == "Col" && LangSel == "02" )
    {document.forms[0].action = "../colombia/"}
 if (CountrySel == "Col" && LangSel == "01" )
    {document.forms[0].action = "../colombia/"}

 if (CountrySel == "Peru" && LangSel == "00" )
    {alert("You need to select a language before you can proceed")}
 if (CountrySel == "Peru" && LangSel == "02" )
    {document.forms[0].action = "../peru/"}
 if (CountrySel == "Peru" && LangSel == "01" )
    {document.forms[0].action = "../peru/"}

 if (CountrySel == "Ven" && LangSel == "00" )
    {alert("You need to select a language before you can proceed")}
 if (CountrySel == "Ven" && LangSel == "02" )
    {document.forms[0].action = "../venezuela/"}
 if (CountrySel == "Ven" && LangSel == "01" )
    {document.forms[0].action = "../venezuela/"}

// if(TermProgram == "Yes"){return false}

Quote:
}

</script>

</head>
<body>

<form action onSubmit="return SelDestination(this)">

<select size="1" name="country" onChange="SelCountryLang(this)">
 <option value=" " selected>Select Your Country</option>
 <option value="Arg">Argentina</option>
 <option value="Bzl">Brazil</option>
 <option value="Chl">Chile</option>
 <option value="Col">Colombia</option>
 <option value="Peru">Peru</option>
 <option value="Ven">Venezuela</option>
</select>

?

<select size="1" name="language">
 <option value="00" selected>Select A Language</option>
 </select>

<input type="submit" value="Submit" name="submit">
</form>

</body>
</html>



Wed, 23 Oct 2002 03:00:00 GMT  
Klaus S. Magnell
#2 / 5
 Need assistance with a complex drop down navigation
Hi Scott

Quote:
> Bug 1 (these are not in any real order)

> If you select a combination and submit it and arrive at your selected page and
> then for some reason you decide to click the back button to go back to select
> a different combination you see that the combination you selected before is
> messed up. The option in the first drop is still selected but the contents of
> the second drop are missing. In their place is a blank selection box with
> nothing to select. If you select a different option in the first box and then
> return to your first selection the contents of the second drop return. There
> has to be a way to fix this so that the options are always visible and
> selectable.

Try this:    <body onload="SelCountryLang(document.forms[0].country)">
By doing this, the page, after every loading, will act as if you have selected
something from the Country drop-down box.

Quote:
> Bug 2

> I have added some basic error handling to correct if someone selects an option
> from the first drop but does not select an option from the second option
> before they hit the submit button and receive an error message alert box. This
> works fine but I am finding that the page refreshes itself after I click ok on
> the alert box. I tried to correct this by adding:
> TermProgram = "Yes"

> if (TermProgram == "Yes"){return false}

> it did stop the page from refreshing but it also stopped the drop down
> navigation jump to work too. Any ideas?

Try this:
if (LangSel == "00" ) {
   if (CountrySel == " ") {
      alert("You need to select a Country and a Language before proceeding!");
   } else {
      alert("You need to select a Language before proceeding!");
   }
   return false;

Quote:
}
> Bug 3

> This isn't really a bug but a question. After you select your combination and
> go to the page you wanted to reach the path in the address bar shows the field
> names and the values within it. Is there a way to hide this?

Try this:    <form method="POST" onSubmit="return SelDestination(this)">
By default, the method used to submit a form is GET. That's why you see the
field/value pairs in the address bar.

Hope this helps.
Klaus



Fri, 25 Oct 2002 03:00:00 GMT  
Scot
#3 / 5
 Need assistance with a complex drop down navigation
Thanks so very much for your help. I'm going to try your suggestions out now
but they look like they should work perfectly. I really owe you one.

Scott



Quote:
> Hi Scott

> > Bug 1 (these are not in any real order)

> > If you select a combination and submit it and arrive at your selected
page and
> > then for some reason you decide to click the back button to go back to
select
> > a different combination you see that the combination you selected before
is
> > messed up. The option in the first drop is still selected but the
contents of
> > the second drop are missing. In their place is a blank selection box
with
> > nothing to select. If you select a different option in the first box and
then
> > return to your first selection the contents of the second drop return.
There
> > has to be a way to fix this so that the options are always visible and
> > selectable.

> Try this:    <body onload="SelCountryLang(document.forms[0].country)">
> By doing this, the page, after every loading, will act as if you have
selected
> something from the Country drop-down box.

> > Bug 2

> > I have added some basic error handling to correct if someone selects an
option
> > from the first drop but does not select an option from the second option
> > before they hit the submit button and receive an error message alert
box. This
> > works fine but I am finding that the page refreshes itself after I click
ok on
> > the alert box. I tried to correct this by adding:

> > TermProgram = "Yes"

> > if (TermProgram == "Yes"){return false}

> > it did stop the page from refreshing but it also stopped the drop down
> > navigation jump to work too. Any ideas?

> Try this:
> if (LangSel == "00" ) {
>    if (CountrySel == " ") {
>       alert("You need to select a Country and a Language before
proceeding!");
>    } else {
>       alert("You need to select a Language before proceeding!");
>    }
>    return false;
> }

> > Bug 3

> > This isn't really a bug but a question. After you select your
combination and
> > go to the page you wanted to reach the path in the address bar shows the
field
> > names and the values within it. Is there a way to hide this?

> Try this:    <form method="POST" onSubmit="return SelDestination(this)">
> By default, the method used to submit a form is GET. That's why you see
the
> field/value pairs in the address bar.

> Hope this helps.
> Klaus



Fri, 25 Oct 2002 03:00:00 GMT  
Scot
#4 / 5
 Need assistance with a complex drop down navigation
Klaus,

Thanks again for your help. I tried your suggestions and 2 out of 3 worked
perfectly. I couldn't be happier because its the most important 2 that
works.

the <body onload="SelCountryLang(document.forms[0].country)">  fixed the
drop selection problem and the

if (LangSel == "00" ) {
   if (CountrySel == " ") {
      alert("You need to select a Country and a Language before
proceeding!");
   } else {
      alert("You need to select a Language before proceeding!");
   }
   return false;

Quote:
}

fixed the navigation problem. However the

<form method="POST" onSubmit="return SelDestination(this)">

 didn't work. I got the following error message.

HTTP Error 405
405 Method Not Allowed

The method specified in the Request Line is not allowed for the resource
identified by the request. Please ensure that you have the proper MIME type
set up for the resource you are requesting.

Please contact the server's administrator if this problem persists.

Any Ideas?

I have access to the server so if this is a settings adjustment that could
be easily fixed. that is once I figure out what it is.

Thanks for your help

Scott



Quote:
> Hi Scott

> > Bug 1 (these are not in any real order)

> > If you select a combination and submit it and arrive at your selected
page and
> > then for some reason you decide to click the back button to go back to
select
> > a different combination you see that the combination you selected before
is
> > messed up. The option in the first drop is still selected but the
contents of
> > the second drop are missing. In their place is a blank selection box
with
> > nothing to select. If you select a different option in the first box and
then
> > return to your first selection the contents of the second drop return.
There
> > has to be a way to fix this so that the options are always visible and
> > selectable.

> Try this:    <body onload="SelCountryLang(document.forms[0].country)">
> By doing this, the page, after every loading, will act as if you have
selected
> something from the Country drop-down box.

> > Bug 2

> > I have added some basic error handling to correct if someone selects an
option
> > from the first drop but does not select an option from the second option
> > before they hit the submit button and receive an error message alert
box. This
> > works fine but I am finding that the page refreshes itself after I click
ok on
> > the alert box. I tried to correct this by adding:

> > TermProgram = "Yes"

> > if (TermProgram == "Yes"){return false}

> > it did stop the page from refreshing but it also stopped the drop down
> > navigation jump to work too. Any ideas?

> Try this:
> if (LangSel == "00" ) {
>    if (CountrySel == " ") {
>       alert("You need to select a Country and a Language before
proceeding!");
>    } else {
>       alert("You need to select a Language before proceeding!");
>    }
>    return false;
> }

> > Bug 3

> > This isn't really a bug but a question. After you select your
combination and
> > go to the page you wanted to reach the path in the address bar shows the
field
> > names and the values within it. Is there a way to hide this?

> Try this:    <form method="POST" onSubmit="return SelDestination(this)">
> By default, the method used to submit a form is GET. That's why you see
the
> field/value pairs in the address bar.

> Hope this helps.
> Klaus



Fri, 25 Oct 2002 03:00:00 GMT  
Klaus S. Magnell
#5 / 5
 Need assistance with a complex drop down navigation
Scott

I haven't tested it so I can't tell it's for sure, but I've seen you setting up
the form's action just like this, right?

   document.forms[0].action = "../brazil/"

I guess that's the problem. Is there an ASP page or a CGI script to receive the
form's posting?

Klaus

Quote:

> Klaus,

> Thanks again for your help. I tried your suggestions and 2 out of 3 worked
> perfectly. I couldn't be happier because its the most important 2 that works.

> the <body onload="SelCountryLang(document.forms[0].country)">  fixed the drop
> selection problem and the

> if (LangSel == "00" ) {
>    if (CountrySel == " ") {
>       alert("You need to select a Country and a Language before
> proceeding!");
>    } else {
>       alert("You need to select a Language before proceeding!");
>    }
>    return false;
> }

> fixed the navigation problem. However the

> <form method="POST" onSubmit="return SelDestination(this)">

>  didn't work. I got the following error message.

> HTTP Error 405
> 405 Method Not Allowed

> The method specified in the Request Line is not allowed for the resource
> identified by the request. Please ensure that you have the proper MIME type
> set up for the resource you are requesting.

> Please contact the server's administrator if this problem persists.

> Any Ideas?

> I have access to the server so if this is a settings adjustment that could be
> easily fixed. that is once I figure out what it is.

> Thanks for your help

> Scott



Sun, 27 Oct 2002 03:00:00 GMT  
 
 Page 1 of 1
  [ 5 post ] 

 Relevant Pages 

1. Debug double drop-down navigation menu problems?

2. Help with script - navigation & drop-down menus

3. navigation bar with drop down menu !

4. Drop Down Navigation - Why wont thiw work in ie3.0

5. Web page navigation drop-down?

6. HELP: Need help with drop down menu's

7. Drop down box - Logic help needed.

8. ASP Question - Need help in setting Drop Down Box default values

9. drop down box and down arrow key

10. Developer Needing assistance...

11. Need assistance!!

12. Need assistance, reference?

  

 
Powered by phpBB® Forum Software