Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

adaptive forms

Avatar

Level 2

Hi Folks,

I have gone through the AEM 6.0 adaptive forms which is built using Bootstrap to bring the responsive nature.

So Why did it called as adaptive forms rather responsive?

If it is adaptive, Is it possible  to change the widgets based on the device context?

Eg:file upload in desktop has to be changed as camera button in mobile

Thanks,

1 Accepted Solution

Avatar

Correct answer by
Employee

Bootstrap is just one part of the Adaptive Form echo system and there are lot of other things that we are and we would be doing in future for responsiveness and may be more than that, to show completely different experience on mobile devices. For example, even today, you can use a separate mobile layout that is different from desktop layout for panels[http://helpx.adobe.com/aem-forms/6/layout-capabilities-adaptive-forms.html]. We use javascript (off course along with media queries) and few other techniques to provide best(and in few cases completely different) experience on different devices. 

Not going into adaptive versus responsive debate, can you point me to the use case you are trying to achieve?

File upload already supports camera capture on device if you set correct mime types in file upload edit dialog. 

View solution in original post

3 Replies

Avatar

Correct answer by
Employee

Bootstrap is just one part of the Adaptive Form echo system and there are lot of other things that we are and we would be doing in future for responsiveness and may be more than that, to show completely different experience on mobile devices. For example, even today, you can use a separate mobile layout that is different from desktop layout for panels[http://helpx.adobe.com/aem-forms/6/layout-capabilities-adaptive-forms.html]. We use javascript (off course along with media queries) and few other techniques to provide best(and in few cases completely different) experience on different devices. 

Not going into adaptive versus responsive debate, can you point me to the use case you are trying to achieve?

File upload already supports camera capture on device if you set correct mime types in file upload edit dialog. 

Avatar

Level 2

My use case has two parts,

  1. Optimize the look and fell of the progress bar and widgets like calendar, numeric field, file upload etc... based on the device from where it get accessed. Eg: Change the numerical text field as slider
  2. Offline support for Mobile. Eg: If the internet connectivity is not there in mobile, then save the form in the app (Phonegap) itself rather try to submit to server. This behavior is needed only for mobile devices. 

Avatar

Employee

For #1, you can create and plug your own widget. A sample around how to do that is available here . In your widget you make your code conditional to show different control for different devices/browser types.

For #2, Offline form is on our roadmap, but currently we do not provide this capability OOTB.