What is the best approach to making mobile accessible forms?
There are many ways to make your iService forms mobile accessible. You can embed HTML tags into the HEAD section of the form, or you can use a complete framework like JQuery Mobile to include themes and extended customization. We've been testing JQuery Mobile 1.2.0 ourselves and this article provides some guidance for you to consider.
- This is the home page for JQuery Mobile. There is a nice app for making basic forms powered by Codiqa on this page.http://jquerymobile.com/test/
- This page provides detailed documentation.http://jquerymobile.com/themeroller/
- This is a nice app for making themes to match your brand and desired layout.
Changes to the Form Element
There are a few changes that must be made the standard form element to work properly with JQuery Mobile.Action Required
iService forms post to the iService Server and typically don't specify an action. However, a specific action is required to work with JQuery Mobile, which is to post to itself. This can be done by hard coding the form number or using the $value parameter as shown below.
<form method="POST" action="form.aspx?formID=64"
An example of using the $value command to automatically insert the value for the current form is shown below.
<form method="POST" action="form.aspx?formID=$value -formid$
You can allow users to select files for upload with their form submission using the $fileupload command
. However, when using JQuery Mobile you must specify in the form element that AJAX is not used. This is illustrated below.
<form method="POST" action="form.aspx?formID=64" enctype="multipart/form-data" data-ajax="false"