display the search Builder on a specific Div

jgknqwvgfhgkkkuiej@ckptr.com

Hello!

I am trying to display the DataTables SearchBuilder in a custom div on my page, but I am facing some issues. Could you please provide guidance on the correct syntax and method to achieve this?

I attempted to use the dom option and jQuery functions, but nothing seems to work. I have attached my code snippets for your reference.

Thank you for your assistance.

kthorngren

It doesn't look like you are using the dom option to display the SearchBuilder. Guessing you want to display the SearchBuilder here:

    <div style="display: flex; flex-direction: row-reverse;">
      <div class="searchDiv"></div>
    </div>

This example shows how to place the SearchBuilder where you want. If you still need help please provide a simepl test case showing what you are trying to do.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

allan

If you want to insert the SearchBuilder control somewhere other than the area immediately around the table (i.e. into a custom div as you said), then see this example which shows how that can be done.

Allan

jgknqwvgfhgkkkuiej@ckptr.com

Thank you for your help,
I found the solution:

initComplete: async function () {
var searchBuilderContainer = await this.api().searchBuilder.container();
$('.ricerca-avanzata').append(searchBuilderContainer);
},

I had to use containre() function to display the search builder in my div with class name 'ricerca-avanzata' .
Note: ricerca-avanzata' means advanced research in italian language.