Formidable Forms Community Site

The Community forums are being phased out in favor of a new Slack group.
Add your email address below to get an invitation to join the community slack group

Slack Signup
Newsletter Optin
Help Desk
Subscribe

Styling tables generated by FF + exporting tables to CSV and Excel

Labels

This Discussion is public

Notifications

I discovered a table styling plugin with Excel / CSV export option. It is based on Data Tables jQuery plugin and integrates seamlessly with FF generated tables. It is also highly configurable. Hope it helps someone 🙂

WP DataTable

Veronica,

Where does the shortcode go in Formidable? I'm a little confused. In the before with the closing in the after? Tried that and I get blank screen.

Thanks,

Mike

I put this code in the After section:

[wp-datatable id="table1" fat="1"]
dom: 'Bfrtip',
paging: true,
lengthChange: true,
ordering: true,
buttons: [
'copy', 'csv'
]
[/wp-datatable]

I put this in Before:

<table id="table1" border="1" data-page-length="30">
<thead>
<TR>
<TH>User</TH>
<TH>Date</TH>
<TH>MoD</TH>
<TH>Score</TH>
<TH>Location</TH>
</TR>
</thead>
<TBODY>

It is picky about correctly formatting header section. Also make sure to use some id (in my case "table1") both in shortcode and table tag.

For export to CSV / Excel please make sure you grab github link from last discussion there that the author posted. I am not sure if he updated files on WP.org

Thanks! That worked perfect. This is pretty awesome. I've been looking for something like this. Great Tip!

Veronica,

Have you had any luck using the styling options like stripe & hover?

Is this something the plugin developer needs to enable in the plugin for it to work?

Thanks,

Mike

I have been working on this concept for quite some time. The plugin likely makes things easier, but I'll share my example.

http://www.techmavenconsulting.com/formidable-pro-datatables-demo/

I have not tested any other parameters yet beyond what I posted above. My main goal was to achieve exporting.

Veronica,

No problem. I was actually able to get the default styling to work. You just need to add a class to the table tag like "Stripe" or "Display".

This has saved me a ton of time. I'm actually going through and converting a lot of my old views using datatables now.

Hi Bobby,

When I add CSV / Excel etc Buttons, my dropdown to show 25/50/100 records disappears. Which parameter do you have that sets that up for you?

Thank you!

Have a look at part 5 of my tutorial. That should help.

http://www.techmavenconsulting.com/2015/12/18/formidable-pro-datatables-tutorial/#p5

Wow, I did not notice there was this great tutorial! Thank you!

Discussion closed.