CODEWITHSUNDEEP
javascriptc#htmlasp.net-mvcdatatables
K V
K V

Reputation: 578

jQuery DataTables append div to specific place

I have code:

<div class="addButton col-lg-6">
    <button type="button" class="btn btn-primary" data-toggle="modal">BTN</button>
</div>
<div class="table-responsive">
    <div id="PositionDataTable2_wrapper" class="dataTables_wrapper form-inline dt-bootstrap no-footer">
        <div id="PositionDataTable2_processing" class="dataTables_processing" style="display: none;">Processing...</div>
        // place where <div class="addButton"> should appear
        <div id="PositionDataTable2_filter" class="dataTables_filter"></div>
        <div class="dataTables_paginate paging_simple_numbers" id="PositionDataTable2_paginate"></div>
    </div>
</div>

I want to take first div, which has addButton class and put into div PositionDataTable2 and place it between the processing and filter parts. But append and prepend only does it inside div start or end.

Also it would be great, if someone would suggest how to place it correctly and make a copy or so that my button wouldn't disappear on datatable fndestroy and recreate.

Upvotes: 0

Views: 1807

Answers (2)

Luiz Pillon
Luiz Pillon

Reputation: 22

You could try using the $.after() insert like:

$(".dataTables_processing").after($(".addButton").html());

Upvotes: 1

kovogel
kovogel

Reputation: 1030

Jquerys insertAfter() should work. Try something like this:

$('div.addButton').insertAfter('div#PositionDataTable2_wrapper');

EDIT: If you don't want that the first addButton disappears you could use .clone()

$('div.addButton').clone().insertAfter('div#PositionDataTable2_wrapper');

Upvotes: 0

Related Questions