Adding "Add Tab" Button Dynamically in jQuery

Question

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

});

Sanjay Kumar N S · Accepted Answer · 2019-02-04 10:31:21Z

1

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);
            });
        });

answered Feb 4, 2019 at 10:31

Sanjay Kumar N S

4,7595 gold badges25 silver badges41 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user1574517 Over a year ago

It's inside the addTab(objId) method. I don't know if I can extract it. I will update the code to show this.

user1574517 Over a year ago

I will try adding them to a queue, then looping the queue outside the addTab() method...

Collectives™ on Stack Overflow

Adding "Add Tab" Button Dynamically in jQuery

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related