Forum Academy Marketplace Showcase Pricing Features

🎉 [New plugin] Json table / spreadsheet (like excel)

Showcase Plugins
#1

Hey guys! I just released a plugin that allows you to add a table / spreadsheet to bubble. After trying all of the paid options available, I still couldn’t find a plugin that would let me properly manage data in my table. (I even offered to pay plugin owners - no luck!)

I wanted users to input a list of info (like addresses and names) and make new bubble data with those inputs. I finally decided to make my own plugin for this, and I think it turned out quite good! Not only does it accomplish this, but it’s flexible enough to be used for almost anything table-related.

You aren’t limited to just text boxes. Choose between text, checkbox, dropdown, autocomplete field, number-only, radio, calendar, image, and color picker. I focused on customization and support. If anyone has ideas to improve the plugin, I’ll try my best to update it.

Screen Shot 2022-10-01 at 3.00.18 PM
Screen Shot 2022-10-01 at 3.00.18 PM1928×392 40.2 KB

:sparkles: Features :sparkles:

  • Import your own Json data to display in the table
  • Export data as Json
  • Custom cell types
  • Custom colors / style
  • Download spreadsheet as CSV
  • Choose between editable or non-editable table
  • Make certain columns read-only
  • Table searching
  • Pagination
  • Lazy loading (for large amounts of data)
  • Copy / paste from other spreadsheets

:link: Documentation
https://devopanda.gitbook.io/json-table-spreadsheet-like-excel/

:link: Demo

:link: Editor

:link: Plugin page

6 Likes
#2

Great job and nice documentation. :muscle:

1 Like
#3

Thank you!!

1 Like
#4

hello,
The table was displayed until yesterday, but today it is not displayed since this morning. The demo screen table is also not displayed.

Why?
Bug in custom code TypeError: Cannot read properties of undefined (reading ‘contextmenu’)
error is displayed.

#5

Hi! I took a look, but I’m not sure I totally understand the issue. Are you having issues with just the bubble editor? Or are you also having issues getting the spreadsheet to show up on your live site. If it’s the latter, could you copy and paste your column json to me? That’s usually the culprit. (Or if you have a link to your app that would be even better)

#6

Really nice work here. Impressive implementation.

1 Like
#7

Thank you very much!! :slight_smile:

#8

Hi @DevoPanda, thanks for the plugin, the demo is amazing!
Just, there are 2 things I don’t get…,

  1. Can I display data from a thing (bubble table row) easily? I guess I need to convert the thing to json with a thing2json plugin, but maybe there is something more straightforward?
  2. And more importantly, can I auto-save data to the thing when users edit a cell? (and how?)

Thank you very much :heart:!!

#9

Hey, yes! That was one of the main uses I made this for. My main intention was for creating data, however I actually just made a few updates to make editing data easier as well! I added your question to the FAQ section of the documentation here and also made an example of this exact use in the bubble app here. (Check out the editor for it and how to set that up here)

I just sent the new update out, so it may take a few to see it. Let me know if you still have any questions - thanks!

1 Like
#10

Any hints on what might be preventing the plugin from showing up on the page? In the editor it seems to be ok, until this morning it was working and I didn’t edit anything in the settings, it just doesn’t appear on the page anymore. I even tried to get the exact same model that is in the plugin demo, but without success.

#11

That’s definitely strange… I’d love to look into it though. If you go into debug mode, does it throw any errors?

#12

The plugin Json table / spreadsheet (excel) / element Json table threw the following error: TypeError: Cannot read properties of null (reading ‘includes’)
at p (https://app.treidou.com/package/run_debug_js/265512f39543b3d8014b641c0aed001bc72ec3d2bae999d487256e8e5ba2d42d/xfalse/x21/run_debug.js:6:2187835)
at Object.m [as color_property_to_rgba] (https://app.treidou.com/package/run_debug_js/265512f39543b3d8014b641c0aed001bc72ec3d2bae999d487256e8e5ba2d42d/xfalse/x21/run_debug.js:6:2188851) (please report this to the plugin author)

#13

Could you send a screenshot of your settings? Specifically the “style” settings - (if you have a link to the editor that would be even better! Also, a link to the page itself would be useful if possible too)

#14

hmmm!!! Perfect! With your request, I noticed that the column and row colors were off. After including, it came back again. I believe it may have reference to the new Bubble update that came out yesterday. Thanks!!!

#15

Ah awesome! That’s what I was thinking may have happened… I’ll make a fix soon to address that so others don’t run into the same issue. Thanks for posting, and if you run into anything else, I’ll be happy to help!

1 Like
#16

question

  1. Is there a way to check (characters/numbers) the values ​​entered in each column?
  2. No matter how wide the overall height is, only 7 lines are displayed. I want to show more. The min dimension is set to 10,20.
  3. For example, if you specify 2 for Freeze columns, even if you scroll left and right, you expected that up to the second column will be displayed fixedly, but it will all be scrolled left and right.
#17

Hey!

  1. One easy way to get your column values is by using regex. Wherever you want to use the data, try getting the “data” from the spreadsheet and “extract with regex”. Then you can add some regex like: ((?<="Column name": ")[^"]*) and this should return a list of results for that column. I realized that you might run into some trouble if a user enters quotes, so I also added the ability to replace double quotes with single quotes instead (you can find that under the advanced options)
  2. I see! It looks like this feature was broken on the plugins end - I’ve just posted a new update that should fix this.
  3. Unfortunately this feature is also broken with an update I made to the scrolling… I couldn’t find a simple way to fix this, so I’ll have to mark this as broken until I find a better fix :frowning: I’ll keep trying on this one to see if I can get a solution.

Let me know if you have any other questions - thanks!

#18

Hi, thanks for your answer.
Let me ask you a question about the content of the answer.

  1. What operation is “extract with regex”. Do you mean settings?
  2. I will check with the new version.
  3. I’m sorry. I think it would be nice if it could be set.

I’m not good at English, so I’m writing with translation software. Sorry if it’s hard to understand.

#19

Hi @DevoPanda
What would you recommend doing to correctly convert the numbers? I use a plugin to import CSV that generates a json result, in which the user can see the result in your Json table plugin.

It turns out that the CSV file can come with different numeric formats:
Default format: 1,000.00
Alternative format: 1.000,00

Do you recommend, or do you have a way, to interpret this number and generate the correct result? I have a file that the product quantity is 1.500 but the table is generating a result of 1.5

Thanks.

#20

image

I tried to put the column type as text, but even typing 1,500 is being automatically converted to 1.5