Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

I've used a combination html, jquery and cql to redraw layers in Openlayers using specified parameters. This worked fine as seen here: http://www.dartmoor-npa.gov.uk/index/test-map3

I also want to reset the layer to show all features. I've added a reset button to the top of my page and another jquery finction at the bottom. Unfortunately this doesn't work.

Not sure where I'm going wrong here. Do I need to combine both the jquery functions into one?

Here is my code in full.

<form id="form">
<select id="camping" name="camping">
<option value="All" selected="selected">All Types</option>
<option name="camping" value="Yes"> Permitted</option>
<option name="camping" value="No"> Not Permitted</option>
</select>
<input id="reset" type="reset" value="reset" />
</form>

<script type="text/javascript" src="http://maps.nationalparks.gov.uk/resources/openlayers/OpenLayers.js"></script> 
<script type="text/javascript"> 


(function () { 
var map, DNPA_camping; 

function initilize() {

    var options = { 
        controls : [new OpenLayers.Control.Navigation(),
        new OpenLayers.Control.Attribution(),
        new OpenLayers.Control.PanZoomBar({id: "anpa"})],   
        maxExtent : new OpenLayers.Bounds(0, 0, 800000, 1300000),      
        projection : "EPSG:27700", 
        units : "m",
        id: "anpa",
        theme: null,
        resolutions: [ 200,50,25,10,5,2.5,1.25,0.635,0.156 ] 
    }; 

    //Create the map object
    map = new OpenLayers.Map( 'npmb-map', options ); 

    var DNPA_camping = new OpenLayers.Layer.WMS('Camping allowed',      
      {
              layers : 'DNPA-camping',                   
              format : 'image/png',         
              transparent: true,                
              tiled : true                  
       }, {
              buffer : 0,
              visibility : true,
                      tileOrigin: new OpenLayers.LonLat(0,0),   
              isBaseLayer: false,               
              transitionEffect: 'resize',           
              attribution:''            
});

map.addLayers([DNPA_camping]); 

var mapContext = OpenLayers.Util.getParameters();
var zoom = mapContext.zoom ? mapContext.zoom : 0;
var centre = mapContext.centre ? mapContext.centre : [280590, 78574];
map.setCenter(new OpenLayers.LonLat(centre[0], centre[1]), zoom);

//Jquery needed to call input
$("#camping").change(function () {
    DNPA_camping.setVisibility(true);
filterval = "use like '%" + $(this).val() + "%'";
    DNPA_camping.params.CQL_FILTER = filterval;
    DNPA_camping.redraw();
});

    //Jquery needed to reset layer  
    $("form").bind("reset",function(){
        $('#camping').change(function(){ 
        DNPA_camping.setVisibility(true);
        DNPA_camping.redraw();
    })  
});
share|improve this question
add comment

2 Answers

up vote 2 down vote accepted

more of a jQuery question, but try:

$("#reset").on("click", function(event) {
    DNPA_camping.setVisibility(true);
    DNPA_camping.redraw(); 
});

edit: or to drop the "reset"-button and have the dropdown make the map show all when selecting all:

$("#camping").change(function () {
    DNPA_camping.setVisibility(true);
    if ($(this).val() === "All") {
        filterval = "";
    } else {
        filterval = "use like '%" + $(this).val() + "%'";
    }
    DNPA_camping.params.CQL_FILTER = filterval;
    DNPA_camping.redraw();
});
share|improve this answer
    
@atelfren Thanks for your help with that. I should have realised that the if/else statement would do the trick. –  Matt T Jun 3 '13 at 14:55
add comment

I adapted the code to work with the cql filter:

$("#camping").change(function () {
    DNPA_camping.setVisibility(true);
     if ($(this).val() === "All") {
    filterval = "use like'%%'";
    } else {
    filterval = "use like '%" + $(this).val() + "%'";
    }
    DNPA_camping.params.CQL_FILTER = filterval;
    DNPA_camping.redraw();
 });
share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.