Insert a DIV in layout

poisons

There should be something very simple not working, but I cannot see.
I am not able to insert a custom DIV in layout, just before the search box
Do you see something wrong I cannot?
Also, the placeholder for search doesn't show up.
All the modification to the pagelength work, modifications to topEnd sections no, it always display the search box, even if I delete it from the Layout.

$('#productsTable').DataTable({
      layout: {
        topStart: {
          pageLength: {
            menu: [ 10, 25, 50, 100 ]
          }
        },
        topEnd: {
          div: {
            className: "form-check form-switch d-inline-block align-middle me-3",
            id: "problemSwitchContainer",
            title: "Show only products with problems",
            innerHTML:
              '<input class="form-check-input" type="checkbox" id="problemSwitch">' +
              '<label class="form-check-label small" for="problemSwitch">Only Problems</label>'
          },
          search: {
            placeholder: 'Search...'
          }
        }
      }
});

kthorngren

I created a test case for you:
https://live.datatables.net/wonukika/1/edit

Note there is no innerHTML option for the div. Use div.html instead as shown in the test case.

Also, the placeholder for search doesn't show up.

The placeholder is shown.

display the search box, even if I delete it from the Layout.

How are you deleting it from layout?

See the defaults section of the docs to see how to delete Search. Here is a test case showing this:
https://live.datatables.net/zubexeqa/1/edit

Kevin

poisons

It is working flawlessly. Thanks!