Get 2024 Templates Mega Bundle!19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets
Get for 99$

How to use the Datatables subtable with API data, instead of the hardcoded demo data?


https://preview.keenthemes.com/html/metronic/docs/general/datatables/subtable

Can you please supply us with the JS code / changes to the example code above that would allow us to feed the subtable data via API instead of the hardcoded demo data as in that example?

I can't find any examples of this anywhere else, not even on Datatables site, so... pretty much in dark in terms of how to do this.

Thanks.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (8)


Hi Serb,

I’ve not used this myself yet but from looking at the example and have a bit of experience with data tables it looks like it just creates a new data table with in the main data table.

To achieve your desired outcome you should look into the data table Ajax option instead of the examples provided data. I’ll have a further look into this after work.

Hope you can get it working!



Hi,

You can refer to this example to use Datatable API. Also you can refer to Child Rows example.

Regards.



Umm, that doesn't help at all... as the example I linked has this populateTemplate() function that populates the subtable and handleActionButton() that triggers that function... your examples don't even remotely relate to any of that.

So as I asked already, can you provide us with an actual FULL code for this example:

https://preview.keenthemes.com/html/metronic/docs/general/datatables/subtable

that uses API data instead of the demo data, and loads each subtable on demand (as in, only pulls specific API data for that subtable, not the whole set for all subtables at once).

Thanks!



Hi,

Noted, however at the moment, we do not have a sub-table code that works with real API. We will consider adding these features in future updates as soon as possible.

Regards.



Can you put one together quickly and provide us with code/example of how to use it, as I asked above?

As I'm coding a live app here and need this working, and can't just hope for this to be added in one of the future updates over the next few months or years.

I thought this was a forum where you provide support for issues like these, so...



Still nothing? I just need a working example of this... I'm sure you can whip it up quickly, given hundreds of examples and such you've put together in the HTML documentation. What's one more?



Hi,

We have been checking this.

Our current example is based on the static data. To use the dynamic data from the API endpoint we need to find a way to feed it with main and sub-table records. Since now Datatable v2 has been released and certain API functions are buggy and so far we could not find a solution for this. Also, it seems like it requires more time and effort to implement it that works with production-ready datasets via API.

We will let you know if we have any progress on this.

Regards.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(