jquery mb.tabset

Schermata 2013-02-28 alle 19.49.57

keep your tabs ordered!

A useful component that let you build a tabbed interface really easily; ad you can even sort your tabs as you want!

see the demodownload it

PayPal

How does it works:

here is the js call:

here is the code for each tabset:

here is the code for each tabContent:

Params

  • sortable: (boolean) define if the tabs are sortable or not
  • position: (“left” or “right”) define the tabset position
  • start: (function) a callBack function on start sort
  • stop: (function) a callBack function on stop sort
  • to set a tab disable just add “disabled” to the tab class
  • to load tab content via ajax just add: class=”tab sel {content:’cont_1_2′, ajaxContent:’your ajax page url’, ajaxData: ‘data you want to send’}”

to store the new position of the tabs there’s a variable   $.mbTabset.mbTabsetArray  that returns an array with new tab position each time a sortable action is completed; this variable is cross tabset so the best is to store on stop event via ajax. You can also use the UI method via:

$(your tabset id).sortable("toArray")or$(your tabset id).sortable("serialize").

 

You can also switch a tabset between sortable or not by invoking:

$(your tabset id).setSortableMbTabset()  to set sortable
or
$(your tabset id).clearSortableMbTabset(); to destroy sortable

78 Responses

  1. Wodzzu
    Wodzzu at · Reply

    Can u tell me function to delete alreade created tab?

  2. Junior
    Junior at · Reply

    How to navigate throug tabs using the buttons inside each tabs

    1. Alex
      Alex at ·

      You cann’t to do this. You must choice another plugin.

  3. Junior
    Junior at · Reply

    Hi There I would like to use buttons to help me navigate through the tabs. I know javascript but I’m not that familiar with ajax. Please help!!

  4. kenanagkurt
    kenanagkurt at · Reply

    can u help me about add my html web site

  5. y8 games
    y8 games at · Reply

    Good. Thanks for sharing

  6. yashmangupta
    yashmangupta at · Reply

    Hi,

    Excellent plugin but want to ask whether can I use this plugin for commercial purposes free of charge or is there any cost associated to it.

  7. kiarash
    kiarash at · Reply

    Hi Matteo
    If I want to have this ability for Telerik : RadTabStrip , what I need to do?

    1. Matteo Bicocchi
      Matteo Bicocchi at ·

      Hi kiarash,
      Sorry but I don’t know how RadTabStrip works…
      Bye,
      Matteo

Leave a Reply