• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

"Select Box" or "Drop Down Box" only works in one spot at a time

Explorer ,
Oct 06, 2016 Oct 06, 2016

Copy link to clipboard

Copied

This is a very odd and very weird for me. I find the multiple "Select Box" scripts rather easy to save space on websites and useful to anyone browsing your title box. However, With this particular site I've been working on I have found it difficult to understand why some Select Boxes don't work - especially the script created directly by Dreamweaver's "Select" option (i.e. Insert -> Form -> Select).

--> Here's a link to a video showing how the Select Boxes are and aren't working as well as the scripts being used and how they are made. <--

Basically they are put together rather simple. Here is an example of the homemade Dreamweaver Select Box after I added all options, with description in italics:

<select name="Pick an Anonymous" size="2" id="Pick an Anonymous" title="Anonymous Options">

  <option value="#">Pick an Anonymous</option>

  <option value="http://www.webdomainhere">name preference here</option>

  <option value="http://www.webdomain#2here/">name preference #2 here</option>

</select>

and this is what you should get:

1.jpg

I do get that^, but when I drop down options and click the preferred option, it does nothing 😕  However, on a previous script - it's the one on top and on the bottom (not a Dreamwever box script style) and it does work. I'm just trying to figure out why. Here it is if you want to see it:

<td rowspan="2"><div align="center">

      <select id="foo">

    <option value="" selected>Pick a Conspiracy!</option>

    <option value="http://www.webdomainhere">name preference here</a></option>

    <option value="http//www.webdomainhere2">name preference here #2</a></option>

   <option value="http://www.webdomainhere3">name preference here #3</a></option>

</select>

<script>

    document.getElementById("foo").onchange = function() {

        if (this.selectedIndex!==0) {

            window.location.href = this.value;

        }       

    };

</script>

The above script is the one that works when is it located FIRST (see video). It's weird and very frustrating not being able to figure out why it won't work why it won't work wherever it's located because it should, right?

Views

2.1K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Expert , Oct 11, 2016 Oct 11, 2016

You have some serious structural html errors that need to be taken care of. Run the validator at http://validator.w3.org/nu to get a listing.

The second drop down list has spaces in the Id, you can't do that.

You also have no javascript telling the browser to use the values of the dropdown menu selections as window locations (a duplicate of lines 55-61 with a corrected id for the second list, for example).

Votes

Translate

Translate
Community Expert ,
Oct 06, 2016 Oct 06, 2016

Copy link to clipboard

Copied

The best way to get help with a code problem is to post a link to your work in progress. Even if it's just uploaded to a test location on your server so we can see all the code and how it functions/malfunctions in our browsers.

If you can't upload to your server and post a link, a very distant second would be pasting all of the code from the page and any dependent file to the forum (don't use email, it won't come through).

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 06, 2016 Oct 06, 2016

Copy link to clipboard

Copied

Sure I can make a testing page, but you would need my password and the such to login and what-not, correct?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 06, 2016 Oct 06, 2016

Copy link to clipboard

Copied

Place it in a publicly available location and link to it, no need for passwords.

I suggest placing a folder called TEST in your root directory, then putting the page in there. Once the problem is figured out, just delete TEST and its contents from the server.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 06, 2016 Oct 06, 2016

Copy link to clipboard

Copied

"It" I assume you're referring to the script OR end browser result? Secondly where do I find that (under what control panel subject directory)? Is it MySQLDatabase that's free and everyone can freely get to? I'm kinda new to this as you can obviously see.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 06, 2016 Oct 06, 2016

Copy link to clipboard

Copied

No, I'm referring to your .html page that you gave code snippets from above being loaded to a public location on your web server.

If you don't have a web server yet, pasting ALL of the page's code, including any external .js or .css files, to the forum would be a very distant second.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 06, 2016 Oct 06, 2016

Copy link to clipboard

Copied

Oh Ok...I have a couple roots under this account and I don't want to used the original index cause it has all the links. Give me a second and I'll have one up in a few....

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 06, 2016 Oct 06, 2016

Copy link to clipboard

Copied

OK I just replied with a simple "example" page but you'll notice that the FIRST Select Box (upper left) works and that will get you to every option - have fun reading/watching it all if you'd like lol - ...but it's the other select boxes don't work at all. Reference the first message (and video link) for more detail and hopefully you'll get a good understanding of the problem.

If you can help me understand I'd thank you a ton. I'm going to watch the Cleveland Indians playoff game for tonight now and I'm a weekend bar-worker-weekend guy so I probably won't be back much until Monday next week. I just hope I'm doing something little and stupid I never knew about lol. Thanks.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 06, 2016 Oct 06, 2016

Copy link to clipboard

Copied

Home of The False Prophet - Conspiracy! ->that's the example page.

Here's a VIDEO showing exactly what's wrong and how everything is not working....

And here is the basic script for the example page as well:

<div align="center"><table width="1024" border="5" cellspacing="2.5" cellpadding="2.5">
  <tbody>
    <tr>
      <td><div align="center">Home to Johnny Anonymous</td>
    </tr>
  </tbody>
</table>

<table width="1024" border="5" cellspacing="2.5" cellpadding="2.5">
  <tbody>
    <tr>
      <td><div align="center">Home</a> </td>
  
<td rowspan="2"><div align="center">
      <select id="foo">
    <option value="" selected>Pick a Conspiracy!</option>
    <option value="http://www.false-prophet.website/ConspiracyPage_About.html">About Conspiracy</a></option>
    <option value="http://www.false-prophet.website/ConspiracyPage_OsamabinLaden.html">Osama Bin Laden Still There?!?!</a></option>
<option value="http://www.false-prophet.website/ConspiracyPage_Chemtrails.html">Chemtrails</a></option>
</select>
<script>
    document.getElementById("foo").onchange = function() {
        if (this.selectedIndex!==0) {
            window.location.href = this.value;
        }       
    };
</script>
     
      <td><div align="center">Illuminati</a> </td>
      <td><div align="center">Demons</a> </td>
      <td><div align="center">Rev's Thoughts</a> </td>
     
<td rowspan="3"><div align="center">
<select name="Pick an Anonymous" size="1" id="Pick an Anonymous" title="Anonymous Options">
  <option value="#">Pick an Anonymous</option>
  <option value="http://www.false-prophet.website/VariousAnonymousPage_Johnny.html">Johnny</option>
  <option value="http://www.false-prophet.website/VariousAnonymousPage_Kyle.html">Kyle</option>
</select>

<td><div align="center">About Spirits</a> </p>
      </blockquote></td>     
    </tr>
  </tbody>
</table>

<td rowspan="2"><div align="center">
      <select id="foo">
    <option value="" selected>Pick a Conspiracy!</option>
    <option value="http://www.false-prophet.website/ConspiracyPage_About.html">About Conspiracy</a></option>
    <option value="http://www.false-prophet.website/ConspiracyPage_OsamabinLaden.html">Osama Bin Laden Still There?!?!</a></option>
<option value="http://www.false-prophet.website/ConspiracyPage_Chemtrails.html">Chemtrails</a></option>
</select>
<script>
    document.getElementById("foo").onchange = function() {
        if (this.selectedIndex!==0) {
            window.location.href = this.value;
        }       
    };
</script>

<span style="font-size: large">

<span style="font-size: medium">copyright&copy;Johnny Anonymous, 2015 - <a href="mailto:">johnnyanonymous@false-prophet.website</a></span></span>
</body>
</html>

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 11, 2016 Oct 11, 2016

Copy link to clipboard

Copied

You have some serious structural html errors that need to be taken care of. Run the validator at http://validator.w3.org/nu to get a listing.

The second drop down list has spaces in the Id, you can't do that.

You also have no javascript telling the browser to use the values of the dropdown menu selections as window locations (a duplicate of lines 55-61 with a corrected id for the second list, for example).

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 17, 2016 Oct 17, 2016

Copy link to clipboard

Copied

LATEST

The link you suggested is awesome and will be used plenty in the future for me - and hopefully all beginners.

I made the adjustments you suggested (id is now just "pick" and I added same previous java scripts; but changed it's id) and the result:

<td rowspan="3"><div align="center">

<select name="Pick an Anonymous" size="1" id="pick" title="Anonymous Options">

  <option value="#">Pick an Anonymous</option>

  <option value="website1">Johnny</option>

  <option value="website2">Payne</option>

  <option value="website3">Kyle</option>

</select>

<script>

    document.getElementById("pick").onchange = function() {

        if (this.selectedIndex!==0) {

            window.location.href = this.value;

        }       

    };

</script>

...and happily I can say it works perfectly FINE 🙂

Thanks very, very much for the help and future source through Ready to check - Nu Html Checker

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines