π This is an example entry form application using DataFormsJS features that allows for entry forms to be defined using only HTML and Templating (Vue, Handlebars, etc).
βοΈ The core [entryForm.js] page object provides a flexible API so itβs easy to customize for complex apps and the code is designed so that it can be easily modified to use as the starting point for a fully custom app if needed.
π The related [listEditor.js] plugin allows for easy development of entry forms that include line item tables or editing of multiple records on the same screen. The list editor is designed to provide a good developer experience because line item tables are fast to create and it allows for a good end user experience because data can be entered quickly.
π¨ This app uses Bootstrap for the layout and includes a number of plugins and controls in addition to the core entry form features.
π All data created by this app is saved on a server in temporary SQLite database using JSON Web Services. Authentication is handled with a custom JavaScript plugin for this page.
<input id="field-{{name}}">
<input name="item-field-{{name}}">
<script
type="text/x-template"
data-engine="{{engine: [vue, handlebars]}}"
src="html/{{page}}.htm"
data-route="/record/:id"
data-page="entryForm"
data-url="entry-form/record/:id"
data-save-url="entry-form/save"
data-delete-url="entry-form/delete/:id">
</script>
data-edit-list="{{name}}"
data-list-item
data-add-item
data-delete-button
data-add-button
data-label="{{user field name}}"
data-type="{{int|float}}"
data-use-save-api="{{true|false}}"
data-list-label="{{name}}"
class="btn-save"
class="btn-delete"
class="info-message"
class="error-message"
class="error-list"