Data Forms is a premium feature. It allows plugin users to add Data Projects or Data Projects pages to a webpage. Tables and data entry forms are fully responsive.
Data Forms uses your Data Projects settings to generate an application or application page, with:
- jQuery DataTables to generate tables
- AngularJS to generate data entry forms
- jQuery UI to style your application
Data Forms does not have the limitations of shortcode wpdadiehard and can be used with any WordPress theme.
Quickstart #
Data Forms can be used in two ways:
Access rights #
Access to Data Forms needs to be enabled:
- Go to your WordPress dashboard
- Go to Settings
- On tab Plugin: enable Shortcode [ wpdadataforms ] for posts and/or pages
- On tab Data Forms: enable Allow anonymous access if applicable
Add a complete Data Project to a webpage #
Add a specific Data Projects page to a webpage #
Styling #
Styling Data Forms is very simpe with jQuery UI. Just select your UI theme in plugin settings:
Settings > WP Data Access > Data Forms > select Default jQuery UI theme
More specific and individual styling will be added later.
Current limitations #
Data Forms does not support WordPress media library management. Media stored in the WordPress media Library is available in view mode only.
Inline editing and data import are not yet implemented.
Future plans #
The flexibility to change options and add code found in Data Tables, will be added to Data Projects as well. These features however, will not be available in Data Projects dashboard applications and shortcode wpdadiehard. It will be added to Data Forms only.
AngularJS is used to generate data entry forms. Features to extend WP Data Access AngularJS objects for customization will be added later.
Hi Peter,
Is there a way to display only part of the field that is retrieved from the remote database, I have a date field that also has a default time 00:00 at the end, I only want to display the date part (10 length yyyy-mm-dd), I tried to set the filed lenght and type in the Designer (please see screenshot: https://gyazo.com/5a8234bedb6c450e0c0a2827bf816dcb), but it has no effect on the search results page: https://www.rutherfordglobal.com/pars-search-results/?wpda_search_column_ccn=014-57776806&wpda_search_column_po= (screenshot here: https://gyazo.com/a9f0ce536e91b4d498196291cec877f4)
Thanks,
Joseph
Hi Joseph,
Data Tables does not use the WordPress date format as it uses jQuery DataTables. So you have to do this manually (at least for now). There are two ways to do this:
(1) Use a view and format your data column in your view definition (SQL)
(2) Add a renderer (JavaScript)
There is tutorial how to add a renderer here:
https://wpdataaccess.com/docs/data-tables-advanced-features/advanced-settings/
Please search for: fnRowCallback
But…I think it should be possible to use the WordPress date format. So I added this issue to my to do list. Not sure if I manage to add it to the next release, but I’ll do my best. Hope you don’t mind to wait a little… 🙂
Thanks,
Peter
Hi Peter,
Appreciate your quick response time and solution provided, I’ll try each of the suggestions and see how it goes and of course I’ll be glad to wait for a final WordPress solution 🙂
Meantime wishing you and your team A Very Happy New Year
Thanks,
Joseph
Hi Peter
Tried to look up all the documentation for dom on https://datatables.net/reference/option/dom, but not able to find anything related to how would I display only first 10 characters of the date value retrieved from the Production remote table or hide anything after 10 characters
This is what I had in my original php page before moving to WordPress:
$itemDate = $row['rdate'];
echo substr($itemDate, 0, 10);
Any suggestion how I convert this to add it in Data Tables Table options (advanced)
Thanks,
Joseph
Hi Joseph,
Below you’ll find the solution. I hope! 🙂 I cannot test it for you…
Please paste this JSON code into the table options advanced column of your publication:
{ "columns":[ null, null, null,
{ "data": "3", "render": "function ( data, type, row, meta ) { return data.substr(0,10); }" },
null, null, null, null ]
}
The third column, which is your date column, is rerendered. If you change your publication, you might need to change your JSON code as well. Make sure the position of your date column matches the position in the columns array:
"data": "3"(start counting from 0).Wishing you a very happy new year! 🙂
Best regards,
Peter
Hi Peter,
Thank you very much, appreciate your help, I added the code and noticed that now the Date is being rendered as full month dd, yyyy so i adjusted the length of the substr to 18, looks fenomenal, even better than before, much appreciated.
Happy New Year 🙂
Thanks,
Joseph