[Users] Radio button in gx_layer question

[Matt Priour]

The gx_layer will render with a radio button & NOT a checkbox when it is given a checkedGroup. So you actually don't want the RadioButtonMixin as it will cause you to have both the checkbox & radio button when given a checkedGroup.

I assume you want the overlay layers to be mutually exclusive. You can do 2 possible things:
1. change your overlay layer group to a baselayer container and overwrite the checkedGroup & loader filter. ex:
...
 text: 'Vannstandsdata', 
nodeType:'gx_baselayercontainer',

loader:{

baseAttrs:{checkedGroup:'overlays'},

filter:function(record){return ['waterlevel','waterlevel2','highlow','average','stations'].indexOf(record.get('layer').name)>-1}

}

...



2. Add the checkedGroup attribute to your overlay gx_layer configs



If you use the 1st one then the children property in the Vannstandsdata config object will be ignored and it will just use defaults for everything that passes the filter.



If you want more control over the qtip, etc... then the 2nd option would be best for you.



Matt Priour

Kestrel Computer Consulting






From: Minika Bjørge 
Sent: Tuesday, March 02, 2010 1:45 AM
To: users at geoext.org 
Subject: [Users] Radio button in gx_layer question


Hi,

 

I am using gx_layers and I would like to display ONLY radio buttons (not check boxes).  How do I do this with RadioButtonMixin.  Please note that I do not want any checkboxes.

 

http://www.geoext.org/lib/GeoExt/widgets/tree/RadioButtonMixin.html

 

 

var LayerNodeUI = Ext.extend(

        GeoExt.tree.LayerNodeUI, 

    new GeoExt.tree.RadioButtonMixin      

      );       

                  

  var treeConfig = [{

          nodeType: "gx_baselayercontainer",  //Nodes for base layer

                                  text: 'Baselayer',

          expanded: true,

          allowDrag: false,

          allowDrop: false,

          draggable: false

       }, 

      {

          text: 'Overlays',

          expanded: true,

          children:[{

                  nodeType: 'gx_layer',

                  layer:land

             },

             {

                  nodeType: 'gx_layer',

                  layer:sea,

                  qtip: 'Seamap'

             }]                

       },

       {

                  text: 'Vannstandsdata',

                  expanded: true,

                  children:[

                   {

                              nodeType: 'gx_layer',

                             layer:    waterlevel,

                             icon:    'img/icon-green.png',

                            qtip: 'Tides'

                   },

                   {

                                  nodeType: 'gx_layer',

                                  layer:    waterlevel2,

                                  icon:    'img/icon-purple.png'

                   },

                   {

                                  nodeType: 'gx_layer',

                                  layer:    average,

                                  icon:    'img/icon-orange.png',

                                  qtip: 'Yearly average'

                                                  

                   },

                   {

                                  nodeType: 'gx_layer',

                                  layer:    highlow,

                                  icon:    'img/icon-yellow.png',

                                  qtip: 'Highest and lowest obeserved levels'

                   },

                   {

                                  nodeType: 'gx_layer',

                                  layer:    stastions,

                                  icon:    'img/icon-red.png',

                                  qtip: 'Survey stations'

                   }]

    }];        

                                

  var tree = new Ext.tree.TreePanel({

           border: false,

            region: "west",

            title: "Choose map",

            width: 220,

            collapsible: true,

            collapseMode: "mini",

            autoScroll: true,

            loader: new Ext.tree.TreeLoader({

                applyLoader: false,

                uiProviders: {

                      "use_radio": LayerNodeUI

                }

          }),

         root: {

            nodeType: "async",

                children: treeConfig

         },         

        rootVisible: false,

        lines: false

        });

                                

Thanks,

 

MB

 



--------------------------------------------------------------------------------


_______________________________________________
Users mailing list
Users at geoext.org
http://www.geoext.org/cgi-bin/mailman/listinfo/users
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://www.geoext.org/pipermail/users/attachments/20100302/64898cff/attachment.htm