6 Replies Latest reply on Oct 6, 2010 7:26 AM by Steven..

    [JS] Editable Dropdown

    Fred Goldman Level 3

      Is it possible to have a dropdown that is editable as you have when you click Save Preset... in the New Document dialog?

       

      ScriptUI CS3 and CS4

        • 1. Re: [JS] Editable Dropdown
          Marijan Tompa [tomaxxi] Level 4

          Hey!

           

          Unfortunately you can't, but you can combine dropdown and edit text like this: http://bit.ly/czEaHA

           

          Or you can stack text box above dropdown element and make it almost same width...

           

          Hope that helps.

           

          --

          tomaxxi

          http://indisnip.wordpress.com/

          1 person found this helpful
          • 2. Re: [JS] Editable Dropdown
            Harbs. Level 6

            Here's what I use:

             

                HarbsUI.TextComboBox = function(container,listItems,selection,width,indent){
                    var fld;
                    container = container.add('group');
                    this.width = width || 100;
                    this.selection = selection || 0;
                    this.listItems = listItems || [];
                    this.text = this.listItems[this.selection] || '';
                    this.indent = indent || 0;
                    container.indent = this.indent;
                    container.orientation = 'stack';
                    container.alignChildren = 'left';
                    fld = container.add("edittext");
                    var dd = container.add("dropdownlist",undefined,undefined,{items:this.listItems});
                    dd.selection=this.selection;
                    dd.preferredSize.width = this.width;
                    var fld2 = container.add("edittext");
                    fld.text =this.text;
                    fld.preferredSize.width = this.width-20;
                    fld2.text =this.text;
                    fld2.preferredSize.width = this.width-20;
                    fld.onChanging = function(){
                        fld2.text = fld.text;
                    }
                    fld2.onChanging = function(){
                        fld.text = fld2.text;
                    }
                    dd.onChange = function(){
                        fld.text = dd.selection.text;
                        fld2.text = dd.selection.text;
                    }
                    return fld;
                }
            
            

             

            Harbs

            • 3. Re: [JS] Editable Dropdown
              Fred Goldman Level 3

              tomaxxi, that is some pretty neat stuff you have there.

               

              Harbs, stacking! Very nice! That is what I was looking for.

              • 4. Re: [JS] Editable Dropdown
                Harbs. Level 6

                In case you are wondering why there's two edtitexts, it's because you can't know reliably whether the first or second item will be on top (on Windows).

                 

                Harbs

                • 5. Re: [JS] Editable Dropdown
                  Fred Goldman Level 3

                  I was wondering, especially because when I tried it looked good. Maybe it's an XP bug.  This brings up another question, when validating  an edit text, I have an onChange event. The question if it doesn't validate how do I return the text to what it was?  I would imagine I would need an onChanging event that first saves the text to a variable, but how would I make that available to the onChange event without a global variable?

                  • 6. Re: [JS] Editable Dropdown
                    Steven.. Level 3

                    Fred Goldman wrote:

                     

                    This brings up another question, when validating  an edit text, I have an onChange event. The question if it doesn't validate how do I return the text to what it was?  I would imagine I would need an onChanging event that first saves the text to a variable, but how would I make that available to the onChange event without a global variable?

                     

                    The classic way is to add variable to editbox object. For example this.oldText = this.text; even though theoretically this is also a global variable (since it can be accessed via dropdown.oldText, it does keep it boxed and away from confusion.

                     

                    Also I don't know if you need on changing event, since it can be saved beginning with nothing in onChange event after validation is successfull.

                    1 person found this helpful