3 Replies Latest reply on Sep 24, 2013 3:52 PM by Cyclonere

    How do remove an item from Dropdown list 2, once the same option has been used in Dropdown list 1?

    Cyclonere

      I have 2 dropdown lists with the months of the year as selectable options.  If a user picks "January" from list 1, I want January to be unavailable as a selection in list 2?  Ideally, only the months AFTER the selected month should show as options in list 2.

       

      obviously I'm new to javascript, so no big words.

        • 1. Re: How do remove an item from Dropdown list 2, once the same option has been used in Dropdown list 1?
          MarkWalsh Level 4

          First, I wouldn't remove an item, i'd rebuild the entire list from a master array (otherwise, you'd just keep deleting values if the user changes their selection). Also, you should probably do the same for the first dropdown, to prevent them from changing to the same value. Put this in the validate event for combobox 1:

           

          var months = new Array ('January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December')
          var selectedMonth = event.value

          var index = months.indexOf(selectedMonth); 

          months.splice(index, 1);

          this.getField('Combo Box 2').setItems (months)


          Change the name of 'Combo Box 2' to match your field's name.

           

          Note: i gets more complicated if you need to update the first combobox when a selection is made in the second, as this will trigger the validation, and cause an infinite loop. If you need to do so, you would need to modify the script(s) a little.

          • 2. Re: How do remove an item from Dropdown list 2, once the same option has been used in Dropdown list 1?
            MarkWalsh Level 4

            Here's an updated script. Put the following into a document level script (be sure to change the field name to match your fields):

             

            var updating = false

            function UpdateComboBox1() {
            var months = new Array ('January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December')
                var selectedMonth = event.value
               
                var index = months.indexOf(selectedMonth); 
               
                months.splice(index, 1);
                if (!updating) {
                    updating = true
                    // NOTE - Change --Combo Box 1-- to match the name of your field
                    this.getField('Combo Box 1').setItems (months)
                    updating  = false
                }
            }

            function UpdateComboBox2() {
            var months = new Array ('January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December')
                var selectedMonth = event.value
               
                var index = months.indexOf(selectedMonth); 
               
                months.splice(index, 1);
                if (!updating) {
                    updating = true
                    // NOTE - Change --Combo Box 2-- to match the name of your field
                    this.getField('Combo Box 2').setItems (months)
                    updating  = false
                }
            }

             

            In the Validate script for Combobox 1, put the following:

            UpdateComboBox2()

             

            In the Validate script for Combobox 2, put the following:

            UpdateComboBox1()

             

            And, make sure that 'Commit selected value immediately' is checked in the Options tab for both fields.

            • 3. Re: How do remove an item from Dropdown list 2, once the same option has been used in Dropdown list 1?
              Cyclonere Level 1

              I'm sure it's my ignorance, but I didn't get this to work. Let me tell you what I did.

               

              Made a new form with 2 dropdown lists named Combo Box 1, and Combo Box 2.

               

              I added the custom validation lines from your post for each box.

               

              Under page properties, open at startup, run a javascript, I pasted the contents of the above post.

               

              Saved & Exit.  When I open the file, I just have 2 empty drop down boxes. 

               

               

              I'm assuming that the code you gave me is supposed to set up each box with the 12 months, or do I still need to enter those choices in the normal way?

               

              THanks for your patience.