JQueryUI Tabs: OK to reuse DOM element ID's?

I am using JQueryUI tabs to display a number of lists. Each list is pulled in from an external file. While each list is unique, there is some common functionality between them - for example, the user is able to delete an item from each list.

I use the currently selected tab to determine how to handle the page, like this:

$("#tabs").tabs({
    load: function(event, ui){
        var tab = $("#tabs").tabs("option", "selected");
        switch(tab){
            case 0:
                // do stuff here
                break;
            case 1:
                // do stuff here
                break;
        }
    }
});

In the "// do stuff here" I refer to each list, which is in a table, with its own ID.

However, when a user wants to delete an item I reuse the same ID:

$("#dlg_delete").dialog();  // options removed for brevity

The div with the id='dlg_delete' appears in each page that is dynamically loaded when a tab is clicked.

Is it OK to reuse that same ID, since it can only be loaded once? Or is there something I may be missing. It is much easier, for code reuse, to just have one id.

Answers


As long as there is only one element with that id in the DOM at any given time, it's OK, if I've understood correctly.

That way, if you want to access something by id, you still can.


Need Your Help

path.join not working in express 3 with node v0.10.41

javascript node.js express

I'm trying to use less with Express 3 but I am getting an error

Blueimp multiple chunk upload with form data

javascript php jquery file-upload blueimp

I want to chunk upload multiple files with form data. Save form data to database and image to a perticualr folder.