Pastebin launched a little side project called VERYVIRAL.com, check it out ;-) Want more features on Pastebin? Sign Up, it's FREE!
Guest

build_base_tables_script.js

By: deadpickle on Dec 10th, 2012  |  syntax: JavaScript  |  size: 2.35 KB  |  views: 28  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. //run only when document is ready
  2. jQuery(document).ready(function($) {
  3.         $(function() {
  4.         var tabTitle = $( "#tab_title" ),
  5.             tabContent = $( "#tab_content" ),
  6.             tabTemplate = "<li><a href='#{href}'>#{label}</a> <span class='ui-icon ui-icon-close'>Remove Tab</span></li>",
  7.             tabCounter = 2;
  8.  
  9.         var tabs = $( "#tabs" ).tabs();
  10.  
  11.         // modal dialog init: custom buttons and a "close" callback reseting the form inside
  12.         var dialog = $( "#dialog" ).dialog({
  13.             autoOpen: false,
  14.             modal: true,
  15.             buttons: {
  16.                 Add: function() {
  17.                     addTab();
  18.                     $( this ).dialog( "close" );
  19.                 },
  20.                 Cancel: function() {
  21.                     $( this ).dialog( "close" );
  22.                 }
  23.             },
  24.             close: function() {
  25.                 form[ 0 ].reset();
  26.             }
  27.         });
  28.  
  29.         // addTab form: calls addTab function on submit and closes the dialog
  30.         var form = dialog.find( "form" ).submit(function( event ) {
  31.             addTab();
  32.             dialog.dialog( "close" );
  33.             event.preventDefault();
  34.         });
  35.  
  36.         // actual addTab function: adds new tab using the input from the form above
  37.         function addTab() {
  38.             var label = tabTitle.val() || "Tab " + tabCounter,
  39.                 id = "tabs-" + tabCounter,
  40.                 li = $( tabTemplate.replace( /#\{href\}/g, "#" + id ).replace( /#\{label\}/g, label ) ),
  41.                 tabContentHtml = tabContent.val() || "Tab " + tabCounter + " content.";
  42.  
  43.             tabs.find( ".ui-tabs-nav" ).append( li );
  44.             tabs.append( "<div id='" + id + "'><p>" + tabContentHtml + "</p></div>" );
  45.             tabs.tabs( "refresh" );
  46.             tabCounter++;
  47.         }
  48.  
  49.         // addTab button: just opens the dialog
  50.         $( "#add_tab" )
  51.             .button()
  52.             .click(function() {
  53.                 dialog.dialog( "open" );
  54.             });
  55.  
  56.         // close icon: removing the tab on click
  57.         $( "#tabs span.ui-icon-close" ).live( "click", function() {
  58.             var panelId = $( this ).closest( "li" ).remove().attr( "aria-controls" );
  59.             $( "#" + panelId ).remove();
  60.             tabs.tabs( "refresh" );
  61.         });
  62.     });
  63.        
  64.        
  65.        
  66.        
  67.        
  68.        
  69.        
  70.        
  71.        
  72.        
  73.        
  74.        
  75.        
  76.        
  77.  
  78. })
clone this paste RAW Paste Data