CODEWITHSUNDEEP
jquerytabs
user1574517
user1574517

Reputation: 1

Adding "Add Tab" Button Dynamically in jQuery

I'm using the jQuery tabs API, and I need to add a list of Add Buttons to a tab's content. What is the proper way to do this? When I try the following, nothing happens when I click the button:

  $( function() {

            $.createElement = function(name)
            {
                return $('<'+name+' />');
            };

        function addTab(objId){

            // .... do stuff

          for(i = 0; i < objIds.length; i++)

            var b = $.createElement('button');
            b.attr('title', 'adds a ' + label + ' tab');
            b.attr('id', 'add_tab_'+createId());

            // AddTab button: just opens the dialog
            b.button().on( "click", function() {
                addTab(objId[i]);
            });

            b.text(label);
            buttonPanel.append(b);
            tabs.append(buttonPanel);

          } // for each objId

         } // addTab

});

Upvotes: 0

Views: 117

Answers (1)

Sanjay Kumar N S
Sanjay Kumar N S

Reputation: 4749

Try this:

$(document).ready(function() {
            var i = 0;
            function addTab(id) {
                $('#tab').append("<button title='add as a label_"+id+"' id='add_tab_"+id+"'>"+id+"</button>")
            }
            $('#btn_add').on( "click", function() {
                i++;
                addTab(i);
            });
        });

Upvotes: 1

Related Questions