Home / Community & Support / Developer Productivity Tools Forums / ASP.NET AJAX > TabStrip > TabStrip: Delete tabs with javascript

• Bert

  Posted on Jul 30, 2008 (permalink)

  Hi,
  
  I'm using a function that I found in the online demo's for deleting tabs. And it seems to work great but when I deleted some tabs and I then click on an existing tab (just selecting it - not deleting it) all deleted tabs are returned. Am I forgetting something because its seems that the remove function only changes the view and not the tabs and pageviews collections
  
  function deleteTab(tabText)
  {
      var tabStrip = $find("<%= rtsTabs.ClientID %>");
      var multiPage = $find("<%= multiPage.ClientID %>");
      var tab = tabStrip.findTabByText(tabText);
      var pageView = tab.get_pageView();
  
      tabStrip.get_tabs().remove(tab);
      multiPage.get_pageViews().remove(pageView);
  }
  
  Thanks
  
  Bert

  Reply

• Paul Paul

  Posted on Jul 31, 2008 (permalink)

  Hi Bert,
  
  By default, changes made in client-side code do not persist over a post-back to the server. To preserve changes, you must use the trackChanges and commitChanges methods:
  
  

  function deleteTab(tabText)

  {

  var tabStrip = $find("<%= rtsTabs.ClientID %>");

  var multiPage = $find("<%= multiPage.ClientID %>");

  var tab = tabStrip.findTabByText(tabText);

  var pageView = tab.get_pageView();

  tabStrip.trackChanges();

  multiPage.trackChanges();

  tabStrip.get_tabs().remove(tab);

  multiPage.get_pageViews().remove(pageView);

  tabStrip.commitChanges();

  multiPage.commitChanges();

  }

  
  
  Regards,
  Paul
  the Telerik team

  
  Check out Telerik Trainer, the state of the art learning tool for Telerik products.

  Reply


• Bert

  Posted on Jul 31, 2008 (permalink)

  Thanks Paul
  
  That was just what I needed

  Reply

• Bert

  Posted on Aug 8, 2008 (permalink)

  I have a new problem with this.
  
  When I delete a tab and a multipage with the track en commitchanges methodes, then I have a problem with the deletion of the pageview of the multipage. It seems that the clientstate of the multipage isn't cleared after deleting it.
  
  ex. when I delete the first tab with pageview he deletes 1 tab and 1 pageview.
  When I delete another tab and I see that in the LoadClientState methode of the RadMultiPage.cs file that still 2 remove statements are found in the clientstate.ChangeLog and then he want's to delete 2 pageviews instead of the one I deleted.
  
  Is there something wrong with my use of trackchanges and commitchanges of the multipage or am I forgetting something?
  
  

  function deleteTab(tabValue)

  {

  var tabStrip = $find("<%= rtsTabs.ClientID %>");

  var multiPage = $find("<%= multiPage.ClientID %>");

  var tab = tabStrip.findTabByValue(tabValue);

  var pageView = tab.get_pageView();

  var tabtabToSelect = tab.get_nextTab();

  if (!tabToSelect)

  tabtabToSelect = tab.get_previousTab();

  tabStrip.trackChanges();

  tabStrip.get_tabs().remove(tab);

  tabStrip.commitChanges();

  multiPage.trackChanges();

  multiPage.get_pageViews().remove(pageView);

  multiPage.commitChanges();

  if (tabToSelect)

  tabToSelect.set_selected(true);

  var arg = "removed/" + tabValue;

  $find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>").ajaxRequest(arg);

  }

  
  Thanks
  
  Bert

  Reply

• Paul Paul

  Posted on Aug 8, 2008 (permalink)

  Hello Bert,
  
  Unfortunately, the provided information does not help us much in reproducing the error. I'm afraid we could not be of much help unless we reproduce the issue on our side. It will be best if you can open a support ticket and send us a simple running project (incl. your custom skin, CSS, images, DB backup if needed and so on) demonstrating the problem (and step-by-step instructions on doing so). In that way we can reproduce and pinpoint the problems you're facing on our side, understand the logic of your application and provide a solution.
  
  Sincerely yours,
  Paul
  the Telerik team

  
  Check out Telerik Trainer, the state of the art learning tool for Telerik products.

  Reply

• Bert

  Posted on Aug 8, 2008 (permalink)

  It's not easy to create a small example.
  
  I just have one more question. I thought that with trackchanges and commitchanges the following would happen.
  
  I start trackchanges. Everything I do with my multipage is stored in the clientState.ChangeLog.
  
  When I call commitchanges. Everything in de ClientState.Changelog is handled server-side.
  
  When I call for a second time in my application the trackchanges method on my multipage and commits it. De ClientState.ChangeLog consists of 2 items (in this case 2 removes) and I was expecting 1 because I already commited my first delete in the first run. 
  
  Thats the way I think it should work. Am I right?
  
  In the foreach of the following piece of code, I found that de ClientState.Changelog isn't cleared.
  
  

  private void LoadClientState(string state)

  {

  JavaScriptSerializer serializer = new JavaScriptSerializer();

  MultiPageClientState clientState = serializer.Deserialize<MultiPageClientState>(state);

  SelectedIndex = clientState.SelectedIndex;

  if (clientState.ChangeLog == null) return;

  foreach (ClientStateLogEntry logEntry in clientState.ChangeLog)

  {

  switch(logEntry.Type)

  {

  case ClientStateLogEntryType.Insert:

  PageViews.AddAt(Convert.ToInt32(logEntry.Index), new RadPageView());

  break;

  case ClientStateLogEntryType.Remove:

  PageViews.RemoveAt(Convert.ToInt32(logEntry.Index));

  break;

  }

  }

  }

  Bert

  Reply

• Bert

  Posted on Aug 8, 2008 (permalink)

  I still have 1 question.
  
  On my first question you answered me that I should use track and commitchanges and it seemed to work. But now I'm wondering why the code on the online demo of telerik doesn't use the track and commitchanges and still deletes the tabs correctly.
  
  Is there an other way to do the deletion without the track and commitChanges?
  
  Thanks
  
  Bert

  Reply

• Kevin

  Posted on Feb 9, 2012 (permalink)

  So if there are additional steps needed to force a tab to stay deleted upon post back, maybe consider adding the additional steps to the demo referenced above. (http://demos.telerik.com/aspnet-ajax/tabstrip/examples/applicationscenarios/deletetabs/defaultcs.aspx)
  
  I was also stuck because the track and commit changes javascript code isn't included in the demo.
  
  I assume most developers would want a deleted tab to remain deleted and this would be expected functionality from a Telerik example on how to delete a tab.  
  
  Thanks
  Kevin

  Reply

Back to Top

Home / Community & Support / Developer Productivity Tools Forums / ASP.NET AJAX > TabStrip > TabStrip: Delete tabs with javascript