...
Code Block |
---|
language | xml |
---|
theme | RDark |
---|
title | Field Types |
---|
|
<input id="myinputname" />
<input id="mycheckbox" type="checkbox" />
<input id="myradio" type="radio" />
<select id="myselectbox"><option value="stuff">Stuff</option></select>
<textarea id="mytextarea"></textarea> |
...
Using the Attach API
Warning |
---|
|
When using the <button> directive in HTML the default behavior type is "submit". You MUST use the phrase 'type="button"' or your button will attempt to submit the entire form to the application. This will cause an error. |
You can trigger the application level file attachment API using the following syntax
Code Block |
---|
language | xml |
---|
theme | RDark |
---|
title | Field Types |
---|
|
<button type="button" data-attach="[attachment name]" id="[something]">Upload</button> |
If you would like to trigger a callback after the file has been loaded, you can add an additional data property. You only need to include the function name and Forms InMotion will add the (filename) parameter.
Code Block |
---|
|
<button type="button" data-attach="[attachment name]" data-attach-callback="[function name in your script]" id="[something]">Upload</button> |
...
Code Block |
---|
|
function attach_resume_callback(filename) {
$("#resume_results").html("Resume attached successfully. File name was: " + filename);
$("#resume").prop('disabled','disabled');
} |
...
Other Button APIs
Warning |
---|
|
When using the <button> directive in HTML the default behavior type is "submit". You MUST use the phrase 'type="button"' or your button will attempt to submit the entire form to the application. This will cause an error. |
In addition to the attachment described above, you can also trigger application behavior through a few other custom button types in your form. Those are:
Submit
Code Block |
---|
language | xml |
---|
theme | RDark |
---|
title | Field Types |
---|
|
<button type="button" data-submit="" id="[something]">Submit Package</button> |
Scan
Code Block |
---|
language | xml |
---|
theme | RDark |
---|
title | Field Types |
---|
|
<button type="button" data-scan="" id="[something]">Scan</button> |
Previous form
Code Block |
---|
language | xml |
---|
theme | RDark |
---|
title | Field Types |
---|
|
<button type="button" data-previous="" id="[something]">Previous</button> |
Next form
Code Block |
---|
language | xml |
---|
theme | RDark |
---|
title | Field Types |
---|
|
<button type="button" data-next="" id="[something]">Next</button> |
Download specific form in this package. This will download the form in the native format. Replace 1 with whatever form you would like downloaded. NOTE forms in a package are zero indexed so the first form is 0, second form is 1, third is 2, etc.
Code Block |
---|
|
<button type="button" data-download-1="" id="[something]">Download form #1 in this package</button> |
Notes on Form Design
- Be sure to set your body to a non-relative size in pixels. Your form is framed into the application using an iframe, so CSS VH or VW units do not work properly. If your body is set to 100% width or height, make sure that all of the elements in the DOM have a set height so your page is rendered properly.
...