🔥 [PLUGIN RELEASE] Advanced Dynamic Tables for Bubble (Excel-like)

Showcase Plugins
1

:rocket: Populate your table with data and update data dynamically at any time.
Update any table’s option dynamically without page reloads.
Includes sorting, search and filtering data out of the box.

Check our demo to see it in action!
Plugin uses latest DataTables library (https://datatables.net) under the hood .

:fire: Some features:

  • Two styling themes
  • Conditional formatting :art:
  • Row selection
  • Columns reordering
  • Populate your table with data dynamically at any time without page reloads
  • Responsive table automatically adapts to any screen size
  • Multiple styling options: hoverable rows, compact mode, striped rows, borders etc
  • 84 languages included
  • Advanced settings (enable/disable search for some columns, enable/disable sorting for some columns, …)

table
table2298Ă—952 240 KB

:link: Demo 1 (Default theme) | Editor

:link: Demo 2 (Semantic UI theme) | Editor

:link: Demo 3 (5000 records) | Editor

Plugin page:

:books: Full Description, Documentation & Screenshots

Feel free to post a comment with any kind of questions, bug reports or feature requests!

16 Likes
2

Dope! @BubbleSam

1 Like
3

Nice job! I made my own personal version a short while back!

It’s a great library and tool!

1 Like
4

Awesome!!!

What terrific timing as I was only looking for something like this yesterday. Love the way you’ve done it as it should fit my needs perfectly.

Looking forward to getting up in the morning so I can have a proper play :slight_smile:

Thanks @BubbleSam

5

Oh thank you @Siddhartha for such an awesome feedback! The plugin was approved and published yesterday :smiley:
I’m very happy that it could be helpful for you!
Feel free to share your thoughts!

1 Like
6

Quick question. It looks like you’ve built the search box right in to the table, which is a great idea.

I was going to use my own selector, but think the built in search option is so much neater (if that is how it works), and more practical for users, but would there be an easy way to use that search criteria to display a total of one of the columns underneath the table. For example, if there was a profit column and someone search for Widget A, is there any way I could display a total below the table (in a separate element) that would give the total profit of Widget As.

Don’t worry if it is a no, as I total get that this isn’t what this plugin is for, but figured I’d ask just in case.

Great work.

1 Like
7

@Siddhartha
Just making sure I understood you correctly, so basically you want to get the current search term and make your own request to the database, right?

If so, then it’s not currently possible but I’ll try to integrate this feature very soon! It’s something that will be really helpful! I probably will add a “Search term” state so it will be possible to get it anytime.

UPD: I’ve just added a bunch of new options (show/hide pagination, search etc) and also new “Search Term” state which contains the current value in the search input :slight_smile: Hope it could be helpful for you!

2 Likes
8

Is it possible to have the table populate based on the user selecting the columns that they want?

For example if there was a check box option and the user selects columns 1 , 3, 5 could the table populate those columns only and ignore the rest of the data?

1 Like
9

Great question @jamie.baggaley !
Yes, it’s possible to show/hide some columns dynamically.
I will add this to our demo and will let you know!

2 Likes
10

hi @jamie.baggaley ,

I’ve just added the show/hide feature to the demo app:

https://digitaleyedemo.bubbleapps.io/datatable

DataTables___Digital_Eye
DataTables___Digital_Eye1946Ă—890 157 KB

2 Likes
11

Wonderful stuff. So can I use this to make a invoice with multiple list items?

13

Thank you for your question!

As far I understand, you want to render a list of products like on this screenshot:

invoice
invoice972Ă—586 64.1 KB

Since it’s just a simple table, it should be possible to use this plugin to render it :slight_smile:

2 Likes
14

:tada: Yay! We worked hard last weekend to add new awesome features to our Advanced Dynamic Table plugin :weight_lifting_woman:

What’s new in release 1.3.X

  • Show / hide search bar
  • Show / hide pagination
  • Enable/disable ordering (sort)
  • Show / hide info bar (“Showing 1 to 10 of 129 entries”)
  • Show / hide pagination controller (number of records per page dropdown)
  • Added possibility to dynamically show / hide some columns
  • Added new state: Search Term. It contains the current search term in the search bar

You can preview and test all these features in our demo app.

As usual, you can find the latest docs here.

3 Likes
15

Hi! Noticed that in mobile, the tabble header does not slides horizontally, just the rows… is it right??

16

Hi @rpetribu ,

That’s a nice catch, thanks!

Actually this is how DataTables lib works on mobile but there is a workaround for that. I’ve just updated the demo, it should work as expected on mobile now :wink:

2 Likes
17

I just purchased and installed the this Plugin. I am getting the following error when the “Populate” workflow executes. What is the issue?

image

18

Is your initialize table code tuning before the table is visible?

1 Like
19

Yes - thank you. The table was not visible before the load. I changed that and it works.

2 Likes
20

Advanced Dynamic Tables v1.4.2 is here!

This small patch adds a new field “Horizontal scrolling”.

Digitaleyedemo___Bubble_Editor
Digitaleyedemo___Bubble_Editor718Ă—662 66.9 KB

When a table is too wide to fit into a certain layout, or you have a large number of columns in the table, you can enable horizontal (x) scrolling to show the table in a viewport, which can be scrolled. This is particularly useful when you want to show the table on mobile devices.

Special thanks to @rpetribu for pointing this out!

5 Likes
21

Perfect! Thanks for this update :+1:

1 Like