Tried to register widget with id==timeSliderDiv but that id is already registered

[DorothyMortenson]

Hello.
I have a button that triggers the timeSlider.  It works great.
Then I have a button to clear it - turn off the layer and empty the slider.
When I click the button for the timeSlider again, I get this error:

Tried to register widget with id==timeSliderDiv but that id is already registered

I realize it's trying to initiate the slider again, but I can't seem to properly destroy and redo it on the fly.

functrion wrTime(){
...
       timeLayer = new FeatureLayer("http://arcgis.wrd.state.or.us/arcgis/rest/services/Dynamic/wr_qry_Time/MapServer/0",
       {mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
        id:"time_layer"
       });
        map.addLayers([timeLayer]);

      
      connect.connect(map,'layer-add-result', initSlider());
      
      function initSlider() {
          var timeSlider = new TimeSlider({
            style: "width: 100%;"
          }, dom.byId("timeSliderDiv"));
          map.setTimeSlider(timeSlider);
          var timeExtent = new TimeExtent();
          timeExtent.startTime = new Date("1/1/1900 UTC");
          timeExtent.endTime = new Date("12/31/2014 UTC");
          timeSlider.setThumbCount(2);
          timeSlider.createTimeStopsByTimeInterval(timeExtent, 2, "esriTimeUnitsYears");
          timeSlider.setThumbIndexes([0,200]);
          timeSlider.startup();
}

function clearTime(){      
      // === Turns the theme off ===
      timeLayer.hide();
      //===== eliminates the element ====
      var element = document.getElementById("timeSliderDiv");
      element.outerHTML = "";
      delete element;
}

I've tried various versions of destroy,  registry.remove, etc.  Then tried recreating the timeSliderDiv, but I am just not getting it right.

Mostly, I just want it to appear as if it cleared. If you were to show the slider, I don't care if it refreshes or picks up where it left off.  No matter how I slice it, tho, I keep ending up with the same error message. 

Suggestions?

[TyroneLigon]

Maybe I'm missing something here, but couldn't you just hide the time slider's div when you don't need it instead of destroying it? If you need to change any time slider parameters, change them, run "timeSlider.startup()", then show the time slider's div.

[DorothyMortenson]

I have run with this idea and have a working solution.

I have loaded the timeslider to the start of the application, but keep the theme turned off until the user selects a radio button.

This will work - I just didn't want to load the thing unless someone really wanted it.

Seemed I just couldn't actually grab the timeSlider itself - only the container.  But it's mute for the moment.   So, I'm still on the lookout for a good "destroy" example.  If anyone comes across this later, please add it to this post.

Thank you all for your help and quick replies. I really appreciate it.

[DorothyMortenson]

Try to register the TimeSlider with a different id and destroy it with that new Id.

got the same result, wit hthe new name.

[JeffPace]

you can try scoping your timeSlider to a global variable.  The easiest way i found to do that is (sample from a custom full extent button)

var customFullExtent = function customFullExtent() {
map.centerAndZoom(initialCenter, initialLevel);
};
//create as global variable so you can call from HTML
lang.setObject("customFullExtent", customFullExtent);

then I can call

customFullExtent() from anywhere

[Anonymous User]

I'm having the same issue with the Editor widget

[Anonymous User]

Dorothy if this helps, it turns out I needed to search for my widget in one DIV higher up, and then destroy from there:

var thing2 = on(stopEdit, "click", function destroyEditor() {
 if (dom.byId("editDivDyn") != null) { //This is the dynamic DIV where I put the Editor widget
  var widgets = registry.findWidgets(editPane_pane); // This is one DIV upwards from where the dynamic DIV is placed
                 if (widgets) {
   arrayUtils.forEach(widgets, function(w) {
    w.destroyRecursive(false); //Destroys widget and dynamic DOM node
    w=null;
   });
  }
 }
});