multiple tables with same ID, only works on first table

LoJack

apologies if this is obvious.

i'm using C# .net and have the same table appearing multiple times on the same page. the code only appears to work on the first instance of the table though:

<script type="text/javascript">
    $(document).ready(function () {
        $('#elements').DataTable({
            paging: false,
            searching: false,
            ordering: false,
            info: false,
            responsive: {
                details: {
                    display: $.fn.dataTable.Responsive.display.childRowImmediate,
                    type: ''
                }
            }
        });
    });
</script>

so my first table with the ID="elements" gets formatted, the subsequent ones don't.

what's the simplest way to fix this?

dingezzz

Change the selector from ID to Class. Id's are only intended for 1 time use on a page and classes are for more then 1

$('#elements').DataTable({});

To

$('.elements').DataTable({});

And change your table id to the class like id="elements" to class="elements"

colin

As @dingezzz says, just use a class instead, or even just the table element type, i.e.:

$('table').DataTable();

C