Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now

I Can't Use Dropdown Menu in DataTables


Hi Brother,
We Use v8.1.1 Contents in Metronic Demo 7 Package,
I Add Dropdown Menu With Columndefs In DataTables
No matter how many times I tried, I couldn't run the menu, but when I click on it, the content does not open.
Please can you help me ?

I fill table contents with data
But no matter how many times I click on the button, it won't open.


var Tablo = $("#TaslakTanimlariListeTablosu").DataTable({
language: {
lengthMenu: "Liste Sayisi _MENU_",
info: "_TOTAL_ Kayit Icerisinden _START_ Ile _END_ Arasi Goruntulenmektedir",
search: "Arama : ",
emptyTable: "Tablo Alanında Veri Bulunamadı",
zeroRecords: "Hiçbir EÅŸleÅŸen Kayıt Bulunamadı",
infoEmpty: "Kayıt Bulunamadı",
infoFiltered: "( Toplam _MAX_ Kayit Uzerinden Filtrelendi )"
},
lengthMenu: [[10, 25, 50, 100, -1], [10, 25, 50, 100, "Tüm Kayıtlar"]],
dom: "<"row"<"col-sm-6 d-flex align-items-center justify-conten-start"l><"col-sm-6 d-flex align-items-center justify-content-end"f>><"table-responsive"tr><"row"<"col-sm-12 col-md-5 d-flex align-items-center justify-content-center justify-content-md-start"i><"col-sm-12 col-md-7 d-flex align-items-center justify-content-center justify-content-md-end"p>>",
data: ListeIcerigi,
rowId: "KayitNo",
columns: [
{ data: "Aciklama" },
{ data: null }
],
columnDefs: [
{
targets: -1,
data: null,
orderable: false,
className: "text-end",
render: function (data, type, row) {
return "<a href="#" class="btn btn-light btn-active-light-primary btn-sm" data-kt-menu-trigger="click" data-kt-menu-placement="bottom-end" data-kt-menu-flip="top-end">&Auml;&deg;&Aring;&#159;lemler<span class="svg-icon svg-icon-5 m-0"><svg xmlns=" xmlns:xlink=" width="24px" height="24px" viewBox="0 0 24 24" version="1.1"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><polygon points="0 0 24 0 24 24 0 24"></polygon><path d="M6.70710678,15.7071068 C6.31658249,16.0976311 5.68341751,16.0976311 5.29289322,15.7071068 C4.90236893,15.3165825 4.90236893,14.6834175 5.29289322,14.2928932 L11.2928932,8.29289322 C11.6714722,7.91431428 12.2810586,7.90106866 12.6757246,8.26284586 L18.6757246,13.7628459 C19.0828436,14.1360383 19.1103465,14.7686056 18.7371541,15.1757246 C18.3639617,15.5828436 17.7313944,15.6103465 17.3242754,15.2371541 L12.0300757,10.3841378 L6.70710678,15.7071068 Z" fill="currentColor" fill-rule="nonzero" transform="translate(12.000003, 11.999999) rotate(-180.000000) translate(-12.000003, -11.999999)"></path></g></svg></span></a><div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-600 menu-state-bg-light-primary fw-bold fs-7 w-125px py-4" data-kt-menu="true"><div class="menu-item px-3"><a href="#" class="menu-link px-3" data-kt-docs-table-filter="edit_row">D&uuml;zenle</a></div><div class="menu-item px-3"><a href="#" class="menu-link px-3" data-kt-docs-table-filter="delete_row">Sil</a></div></div>";
},
},
],
"bDestroy": true
});


<img src=" />


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (2)


Hello,
Are you solving this problem ?? because I have the same issues, but I can not solve it.
help me, please
Thanks,



Hi,

Can you check this working demo where datatable has KTMenu-based dropdown menus? You can also check it in the original HTML templates in your downloaded package.

You can check the JS code of the Menu here: src/js/custom/apps/ecommerce/catalog/products.js.

If you need any further help please provide your browser console log if there is any js error.

Regards.


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(