0

I am creating Jquery Tabs dynamically by passing in a viewName parameter. I am trying to figure out how to use this to trigger another function based on the id of the dynamically created Tab.

Here is function that creates the Tabs and assigneds them an ID and Name dynamically.

function SetImportedView(viewName, scriptValue) {
/* put the values we received in parameters into create view tabs*/
$('<li id="' + viewName + '">' + '<a href="' + '#tabs-1' + '"</a>' + viewName +    '</li>').insertBefore('#new');
}

I need to trigger a another function that is specific to the ID of the Tab that is clicked.

something like this:

$(this.tab).click(function() {
 doSomething
}
3
  • Where is the code $(this.tab) coming from? Can't help you use the context object if we don't know the context. Jan 6, 2013 at 0:35
  • @AndrewHubbs that was just an example. It does not exist. I am trying to figure out how I target an element that was created dynamically and I dont know the ID of it. Hope that makes sense
    – Rob
    Jan 6, 2013 at 0:37
  • also jfyi I already intitailized tabs $('#tabs').tabs()
    – Rob
    Jan 6, 2013 at 0:38

3 Answers 3

1

What's with this

function SetImportedView(viewName, scriptValue) {
    /* put the values we received in parameters into create view tabs*/
    $('<li id="' + viewName + '">' + '<a href="' + '#tabs-1' + '"</a>' + viewName +    '</li>')
        .on( 'click', 'a' function( ev ) {
            // link in li clicked
         } )
        .insertBefore('#new');
}

edit

ok, you mean something like this?!?!

$( 'li' ).on( 'click', 'a', function( ev ) {
    var tabID = $( this ).parent().attr('id');

    // do something here with your tabID
} );
1
  • sorry, that does not seem to work. I will have many tabs created. After they are all created dynamically I will want to click on various tabs and trigger a function that looks at the tabs id as a parameter.
    – Rob
    Jan 6, 2013 at 0:43
0

simply put an onclick on your "a" tag so it renders like this:

<a href="javascript:void(0);" onclick="return myFunction();">TAB #1</a>
1
  • Tab-1 is a form template. All tabs go to this form block. The data inside the form is based on the tab that is clicked. I need to be able to determine which tab is clicked after all the tabs have been created.
    – Rob
    Jan 6, 2013 at 0:46
0

Solved...

$('#tabs ul li a').click(function() {
        console.log($(this).attr('id'));
    });
1
  • No need to wrap your element in jQuery for that, $(this).attr('id') is equivalent to this.id
    – webaware
    Jan 6, 2013 at 1:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.