Skip to main content
Known Participant
April 16, 2017
Answered

Replaced the scroll bar with a drop down list. A dialog box.

  • April 16, 2017
  • 2 replies
  • 534 views

I needed to create a menu by adding a scrollbar on radio buttons to a dialog box.

How to make a scrollbar work in a dialog box.

Our friend Chuck Uebele gave me a wonderful idea and helped me create a dropdown list, it really is a great idea and it was a marvel, however, I needed to add 3 more buttons (two radio) and a checkbox, all Organized by groups of panels:

GP1: (Dropdown list)

GP2: (Radio and Checkox)

I noticed that clicking on the "OK" button, the events in Group 2 (GP2) did not work

I need all events to run only when I click the OK button.

Script:

var dlg = new Window('dialog','Caneca Opções'); 

    dlg.orientation = "column";       

    dlg.alignChildren = "top";  // insert this line   

    

    var GP1 = dlg.add('group')

           GP1.orientation = 'row';

           GP1.alignment = ['left','top']; 

   

    var GP2 = dlg.add('group')

           GP2.orientation = 'row'; 

           GP2.alignment = ['left','top'];   

   

   

    var list = GP1.add('panel',undefined,'Modelo da Caneca');   

            list.orientation = 'row';

            list.alignment = ['left','top']; 

     var listdropDown =list.add ("dropdownlist", undefined, [ 

     "Alça e Interior Azul",   

     "Alça e Interior Vermelho", "Alça e Interior Preta             ", 

     "Alça e Interior Roso", "Do Tipo Toda Branca", 

     "Do Tipo Pratiada", "Do Tipo Caneca Mágica", 

     "Interior Azul", "Interior Roso", "Interior Verde", 

     "Interior Vermelho", "Interior Preto", "Modelo dia dos Pais",

     "Caneca de Aluminio", "Meia Estampa " , "Caneca Dupla"

  ]); 

listdropDown.selection = 0;

        

var radio_group = GP2.add('panel', undefined, "Complement Settings ");

//var radio_group2 = GP2.add('panel',undefined,'Backup');       

    // Radio 

        radio_group.orientation="row";

        radio_group.alignChildren = "left"; 

        radio_group.add("radiobutton", undefined, "2 vezes");

        radio_group.add("radiobutton", undefined, "Juntar");

        radio_grouporientation = 'row'; 

        radio_group.alignChildren = ['left','top']; 

        var check1 = radio_group.add('checkbox',undefined,'Save'); 

        check1.value = true; 

    var btnGroup = GP1.add("group");       

        btnGroup.orientation = "column";   

        btnGroup.alignment = ['left','top'];     

        btnGroup.add ('button', {x:90, y:125, width:90, height:25}, 'Ok', {name:'ok'});   

        btnGroup.add ('button', {x:240, y:125, width:90, height:25}, 'Cancel', {name:'cancel'});   

btnGroup.ok.onClick = function(){ 

dlg.close() 

    switch(parseInt(listdropDown.selection)){ 

            case 0:    

            //code here    

            alert("Alça e Interior Azul");    

            break;    

        case 1:    

            //code here    

            alert("Alça e Interior Vermelho");  

            break;    

        case 2:    

            //code here    

            alert("Alça e Interior Preta");    

            break;  

        } 

    } 

   // Radio

   // radio_group.children[0].value = true;

  function selected_rbutton(rbuttons) {

        for (var i = 0; i < rbuttons.children.length; i++) {

            if (rbuttons.children.value == true) {

                return rbuttons.children.text;

            }

        }

    }

    // Linkar com os Scrips.jsx

    if (dlg.show() == 1) {

        var chosenRadioButton = selected_rbutton(radio_group);

        switch (chosenRadioButton) {

            // Linkar com os Scrips.jsx

        case "2 vezes":

            alert("2x a Mesma");

            break;

            // Linkar com os Scrips.jsx

        case "2 x":

            alert("Juntar");

            break;

        }

      if(check1.value){alert('Save')}  

   }

I think it has something related to this line:

BtnGroup.ok.onClick = function () {

Friends, how do you fix this problem? Any suggestions or help will be valid. Thank you

This topic has been closed for replies.
Correct answer Chuck Uebele

You can add it to either one. I like using the onClick one. You need to also add a dlg.show() statement when you use that and not the other method:

var dlg = new Window('dialog','Caneca Opções');   

        dlg.orientation = "column";         

        dlg.alignChildren = "top";  // insert this line     

          

        var GP1 = dlg.add('group') 

               GP1.orientation = 'row'; 

               GP1.alignment = ['left','top'];   

         

        var GP2 = dlg.add('group') 

               GP2.orientation = 'row';   

               GP2.alignment = ['left','top'];     

         

         

        var list = GP1.add('panel',undefined,'Modelo da Caneca');     

                list.orientation = 'row';  

                list.alignment = ['left','top'];   

     

     

         var listdropDown =list.add ("dropdownlist", undefined, [   

         "Alça e Interior Azul",     

         "Alça e Interior Vermelho", "Alça e Interior Preta             ",   

         "Alça e Interior Roso", "Do Tipo Toda Branca",   

         "Do Tipo Pratiada", "Do Tipo Caneca Mágica",   

         "Interior Azul", "Interior Roso", "Interior Verde",   

         "Interior Vermelho", "Interior Preto", "Modelo dia dos Pais", 

         "Caneca de Aluminio", "Meia Estampa " , "Caneca Dupla" 

      ]);   

     

     listdropDown.selection = 0;  

              

    var radio_group = GP2.add('panel', undefined, "Complement Settings "); 

    //var radio_group2 = GP2.add('panel',undefined,'Backup');         

        // Radio   

            radio_group.orientation="row"; 

            radio_group.alignChildren = "left";   

            radio_group.add("radiobutton", undefined, "2 vezes"); 

            radio_group.add("radiobutton", undefined, "Juntar"); 

     

            radio_grouporientation = 'row';   

            radio_group.alignChildren = ['left','top'];   

            var check1 = radio_group.add('checkbox',undefined,'Save');   

            check1.value = true;   

     

     

     

        var btnGroup = GP1.add("group");         

            btnGroup.orientation = "column";     

            btnGroup.alignment = ['left','top'];       

            btnGroup.add ('button', {x:90, y:125, width:90, height:25}, 'Ok', {name:'ok'});     

            btnGroup.add ('button', {x:240, y:125, width:90, height:25}, 'Cancel', {name:'cancel'});     

     

     

     

     

     

    btnGroup.ok.onClick = function(){   

    dlg.close()   

        switch(parseInt(listdropDown.selection)){   

                case 0:      

                //code here      

                alert("Alça e Interior Azul");      

                break;      

            case 1:      

                //code here      

                alert("Alça e Interior Vermelho");    

                break;      

            case 2:      

                //code here      

                alert("Alça e Interior Preta");      

                break;    

            }   

       

            var chosenRadioButton = selected_rbutton(radio_group); 

            switch (chosenRadioButton) { 

                // Linkar com os Scrips.jsx 

            case "2 vezes": 

                alert("2x a Mesma");  

                break; 

                // Linkar com os Scrips.jsx 

            case "2 x": 

                alert("Juntar");  

                break;    

            } 

          if(check1.value){alert('Save')}          

        }   

     

       // Radio 

       // radio_group.children[0].value = true; 

      function selected_rbutton(rbuttons) { 

            for (var i = 0; i < rbuttons.children.length; i++) { 

                if (rbuttons.children.value == true) { 

                    return rbuttons.children.text; 

                } 

            } 

        } 

   

    dlg.show();//add a show statement

     

/*  This entire part csn be deleted  

        // Linkar com os Scrips.jsx 

        if (dlg.show() == 1) { 

            var chosenRadioButton = selected_rbutton(radio_group); 

            switch (chosenRadioButton) { 

                // Linkar com os Scrips.jsx 

            case "2 vezes": 

                alert("2x a Mesma");  

                break; 

                // Linkar com os Scrips.jsx 

            case "2 x": 

                alert("Juntar");  

                break; 

     

     

            } 

          if(check1.value){alert('Save')}    

       } 

      */

2 replies

Chuck Uebele
Community Expert
Community Expert
April 18, 2017

Glad its working now.

Chuck Uebele
Community Expert
Community Expert
April 17, 2017

Put everything in either the btnGroup.ok.onClick function or in the if(dlg.show()==1.These are redundant and most likely only one will work.

Ps-DesignAuthor
Known Participant
April 17, 2017

Hi, Chuck Uebele I'm sorry for my lack of understanding: As I put it in practice, do I put everything in the btnGroup.ok.onClick function or in the if (dlg.show () == 1? How to do this as a checkbox too? I do not know how to modify.

Chuck Uebele
Community Expert
Chuck UebeleCommunity ExpertCorrect answer
Community Expert
April 17, 2017

You can add it to either one. I like using the onClick one. You need to also add a dlg.show() statement when you use that and not the other method:

var dlg = new Window('dialog','Caneca Opções');   

        dlg.orientation = "column";         

        dlg.alignChildren = "top";  // insert this line     

          

        var GP1 = dlg.add('group') 

               GP1.orientation = 'row'; 

               GP1.alignment = ['left','top'];   

         

        var GP2 = dlg.add('group') 

               GP2.orientation = 'row';   

               GP2.alignment = ['left','top'];     

         

         

        var list = GP1.add('panel',undefined,'Modelo da Caneca');     

                list.orientation = 'row';  

                list.alignment = ['left','top'];   

     

     

         var listdropDown =list.add ("dropdownlist", undefined, [   

         "Alça e Interior Azul",     

         "Alça e Interior Vermelho", "Alça e Interior Preta             ",   

         "Alça e Interior Roso", "Do Tipo Toda Branca",   

         "Do Tipo Pratiada", "Do Tipo Caneca Mágica",   

         "Interior Azul", "Interior Roso", "Interior Verde",   

         "Interior Vermelho", "Interior Preto", "Modelo dia dos Pais", 

         "Caneca de Aluminio", "Meia Estampa " , "Caneca Dupla" 

      ]);   

     

     listdropDown.selection = 0;  

              

    var radio_group = GP2.add('panel', undefined, "Complement Settings "); 

    //var radio_group2 = GP2.add('panel',undefined,'Backup');         

        // Radio   

            radio_group.orientation="row"; 

            radio_group.alignChildren = "left";   

            radio_group.add("radiobutton", undefined, "2 vezes"); 

            radio_group.add("radiobutton", undefined, "Juntar"); 

     

            radio_grouporientation = 'row';   

            radio_group.alignChildren = ['left','top'];   

            var check1 = radio_group.add('checkbox',undefined,'Save');   

            check1.value = true;   

     

     

     

        var btnGroup = GP1.add("group");         

            btnGroup.orientation = "column";     

            btnGroup.alignment = ['left','top'];       

            btnGroup.add ('button', {x:90, y:125, width:90, height:25}, 'Ok', {name:'ok'});     

            btnGroup.add ('button', {x:240, y:125, width:90, height:25}, 'Cancel', {name:'cancel'});     

     

     

     

     

     

    btnGroup.ok.onClick = function(){   

    dlg.close()   

        switch(parseInt(listdropDown.selection)){   

                case 0:      

                //code here      

                alert("Alça e Interior Azul");      

                break;      

            case 1:      

                //code here      

                alert("Alça e Interior Vermelho");    

                break;      

            case 2:      

                //code here      

                alert("Alça e Interior Preta");      

                break;    

            }   

       

            var chosenRadioButton = selected_rbutton(radio_group); 

            switch (chosenRadioButton) { 

                // Linkar com os Scrips.jsx 

            case "2 vezes": 

                alert("2x a Mesma");  

                break; 

                // Linkar com os Scrips.jsx 

            case "2 x": 

                alert("Juntar");  

                break;    

            } 

          if(check1.value){alert('Save')}          

        }   

     

       // Radio 

       // radio_group.children[0].value = true; 

      function selected_rbutton(rbuttons) { 

            for (var i = 0; i < rbuttons.children.length; i++) { 

                if (rbuttons.children.value == true) { 

                    return rbuttons.children.text; 

                } 

            } 

        } 

   

    dlg.show();//add a show statement

     

/*  This entire part csn be deleted  

        // Linkar com os Scrips.jsx 

        if (dlg.show() == 1) { 

            var chosenRadioButton = selected_rbutton(radio_group); 

            switch (chosenRadioButton) { 

                // Linkar com os Scrips.jsx 

            case "2 vezes": 

                alert("2x a Mesma");  

                break; 

                // Linkar com os Scrips.jsx 

            case "2 x": 

                alert("Juntar");  

                break; 

     

     

            } 

          if(check1.value){alert('Save')}    

       } 

      */