dynamic form

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • judyw
    New Member
    • Dec 2008
    • 3

    dynamic form

    I am trying to build a form with many options depending on each other.

    I purchased a script called dynamic list options with which I create arrays of options that populate select boxes like this:

    <select name="productSw ags" onChange="Popul ateOptions(this , 'productFabric' );">

    I can also create arrays like this:

    var Array4 = new Array(PleaseSel ect,'[ArrayFabric1]Single Swag','[ArrayFabric2]Two Swags')

    This way I can populate each select box depending on the option selected and have numerous options depending on each other.

    My question now is: I want to be able to populate more than one select box at once. I can do this:

    <select name="productSw ags" onChange="Popul ateOptions(this , 'productFabric' );PopulateOptio ns(this, 'productTrim')" >

    but doing so will populate both select boxes with the same options. What I am trying to do is populate each select box with a its own set of options.

    I want to set up the arrays in a certain way that each populateOptions will
    only put in the options that belong to it.

    Can somebody help me do this?

    This is the page I am working on so you can see what I mean:

    Customize your own swag valance

    Thank you

    Judy
  • acoder
    Recognized Expert MVP
    • Nov 2006
    • 16032

    #2
    If you use the id, you can refer to the other select boxes to populate them too, e.g. document.getEle mentById(id) would give you a reference to the element.

    Comment

    • judyw
      New Member
      • Dec 2008
      • 3

      #3
      Can you please explain me where to put this in with my example.

      Sorry I am not very good in javascript so I don't know how to do it without an example and then I can copy and paste it on the other places.

      Thanks

      Judy

      Comment

      • acoder
        Recognized Expert MVP
        • Nov 2006
        • 16032

        #4
        You say you can do this:
        Code:
        <select name="productSwags" onChange="PopulateOptions(this, 'productFabric');PopulateOptions(this, 'productTrim')">
        but it populates both with the same options. Having had a look at the code for PopulateOptions , it seems that the code is a bit inflexible, but we can work around that.

        You need to pass a reference to the drop-down list you want to populate from, so use document.getEle mentById("produ ctSwags") to refer to the "productSwa gs" drop-down, but only after giving it an id:
        Code:
        <select name="productSwags" id="productSwags">

        Comment

        • judyw
          New Member
          • Dec 2008
          • 3

          #5
          This is where the populate options pulls the options from:

          Code:
          var Array4 = new Array(PleaseSelect,'[ArrayFabric1]Single Swag','[ArrayFabric2]Two Swags')
          The populate options only specifies which select box to put the list in. If I would put in ArrayTrim1 in the above brackets both productFabric and productTrim will get populated with the trim options(or whatever options I put in.)

          So how can I add ArrayFabric1 and ArrayTrim1 to the above code?

          Comment

          • acoder
            Recognized Expert MVP
            • Nov 2006
            • 16032

            #6
            The way PopulateOptions works is that it takes the drop-down element and gets the array name from the selected, so you can only have one array at a time which is quite inflexible. It would have made more sense to keep things more flexible. You'll either have to change the function code or use something else.

            Comment

            Working...