Web Analytics Made Easy - StatCounter Drop down lists - CodingForum

Announcement

Collapse
No announcement yet.

Drop down lists

Collapse
X
Collapse
 
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
  • #1

    Drop down lists

    Hello all!

    Im new to the forum, my first post in fact, I hope someone can help me. I have no idea how to do this but im pretty sure it's done in javascript.

    I want to create a javascript file that to store the contents of a drop down list in. Such as this in html:

    Code:
    <select name="data" id="data">
  <option value="data value for item 1">Item 1 </option>
  <option value="data value for item 2">Item 2 </option>
</select>
    In the place where the drop down list should be on the web page, I want to add a javascript include to display the drop down list from the javascript file in the web page, such as:

    Code:
    <script type="text/javascript" src="http://www.mydomain.com/data.js"></script>

    I hope this makes sense and someone can help me!! I have no clue where to begin and thought some expert javascript coder would have an idea abou this.

    Best regards,

    NPC
    Tags: None
  • #2
    Is this because you need to have the select table on more that one page?

    If so you might want to look at using SSI's (Server Side Includes) instead. They'll allow you to re-use ordinary html content in multiple pages.
    Check out the Forum Search. It's the short path to getting great results from this forum.

    Comment

    • #3
      Is this because you need to have the select table on more that one page?
      Partly, Im using two drop down lists each containing about 200 items. So its partly to keep it easliy manageable (2 big lists over quite a few pages) and partly to keep the page simple enough for search engine indexing.

      How does SSI work? does that mean I would have to store as shtm?

      NPC

      Comment

      • #4
        What name your files will require depends on how your server is set up but usually it's .shtml or .stm though I've seen it al .html-ssi on one server.

        Basically SSI's work by interpreting special comments within the html code, the basic form is <!--#[i]ssi function here[i]-->.

        For a file inclusion like I mentioned, you've have the HTML you need in a separate file (let's call it example.htm for now). Your web server would then replace the special comment with the contents of example.htm at the point where it sees this comment:

        <!--#include file="example.htm"-->

        For a better explanation see: http://www.georgedillon.com/web/ssi.shtml
        Check out the Forum Search. It's the short path to getting great results from this forum.

        Comment

        • #5
          This may help. I had these codes handy and it did not take much
          to add the function to write the option menu to the page.....
          Code:
          <script type="text/javascript">
 <!--//
  function loadOptions(which){
    var theOptions = document.form1.menu; // FORM NAME //;
    var main = new Array();
        main[0]=new Option('Pick A Subject','default');
        main[1]=new Option('Animals','animals');
        main[2]=new Option('Cars','cars');

    var animals = new Array();
        animals[0]=new Option('Pick An Animal','default');
        animals[1]=new Option('Cats','cats');
        animals[2]=new Option('Dogs','dogs');
        animals[3]=new Option('Pigs','pigs');
        animals[4]=new Option('Return To Main Menu','main');

    var cars = new Array();
        cars[0]=new Option('Pick A Car','default');
        cars[1]=new Option('Buick','buick');
        cars[2]=new Option('Chevy','chevy');
        cars[3]=new Option('Olds','olds');
        cars[4]=new Option('Return To Main Menu','main');

   if(which.toLowerCase() == 'main')    {myOptions = main};
   if(which.toLowerCase() == 'animals') {myOptions = animals};
   if(which.toLowerCase() == 'cars')    {myOptions = cars};

     for(j=theOptions.length; j>myOptions.length-1; j--){
       if(theOptions.length > myOptions.length){
          for(i=0; i<myOptions.length; i++){
              theOptions[i] = myOptions[i];
              theOptions[j] = null;
          }
       }
     }

       if(myOptions.length > theOptions.length){
         for(i=0; i<myOptions.length; i++){
             theOptions[i] = myOptions[i];
         }
       }

  }

  function writeOptions(){
    with(document){
     writeln('<form name="form1">');
     writeln('<select name="menu" onchange="loadOptions(this[this.selectedIndex].value)">');
     writeln('</form>');
     }
   loadOptions('main');
  }
 //-->
</script>
</HEAD>

<BODY>
<script type="text/javascript">document.write(writeOptions())</script>
          .....Willy

          Comment

          Previous template Next
          Working...
          X