[GIS] How to add/remove layer based on Dropdown Selection in openlayers3

Question

I am using Openlayers 3 to add list of layers. I want to display only one layer based which is selected in dropdown.

I am defining layers are:

 var layers1 = new ol.layer.Group({
        layers: [
          new ol.layer.Image({

              source: new ol.source.ImageWMS({
                  url: 'http://localhost:8080/geoserver/rdpr/wms',
                  params: {
                      'FORMAT': 'image/png',
                      'VERSION': '1.1.0',
                      'LAYERS': 'rdpr:rdprgeo'
                  },
                  serverType: 'geoserver'
              })

          })
        ]
    });

    var layers2 = new ol.layer.Group({
        layers: [
           new ol.layer.Image({

               source: new ol.source.ImageWMS({
                   url: 'http://localhost:8080/geoserver/rdpr/wms',
                   params: {
                       'FORMAT': 'image/png',
                       'VERSION': '1.1.0',
                       'LAYERS': 'rdpr:sericulturegeo'
                   },
                   serverType: 'geoserver'
               })

           })
        ]
    });

On dropdown change I am calling function to add map:

 $(document).on('change', '#ddlDept', function (e) {
        e.preventDefault();
        dept = $('#ddlDept').val();
        setMapType(dept);
    });

    function setMapType(dept) {
        if (dept == 'RDPR') {
            map.addLayer(layers1);
        } else if (dept == 'Sericulture') {

            map.addLayer(layers2);

        }
    }

Here layer is adding how I can show only one layer at a time.

Answer 1

removeLayer

if (dept == 'RDPR') {
            map.addLayer(layers1);
            map.removeLayer(layers2);

            } else if (dept == 'Sericulture') {

            map.addLayer(layers2);
            map.removeLayer(layers1);
        }

Its working foe me. But i want to customize layer based on drodown selection.