XPages and Me

My Journey into XPages Development

Tag Archives: Bootstrap Panel

Splitting up: Another Way to Handle Large Forms – Part 1: The Bootstrap Panel Custom Control

An important part to splitting up the the forms is, to have a panel that can be animated. For each step in your process to guide the user thru filling out the large from, you’ll need one panel. And to make the transition between each step look nice, you’d want to use JQuery animation.

Take a look at the following posts. They’ll explain how to set up a reusable Panel custom control and how to enhance it, so we can use it for our purposes:

Dabbling in Boostrap and Font Awesome Part 6-8: re(Use) Me! (Panel)

Diving into Bootstrap and Font Awesome – Part 2: Enhancing the Bootstrap Panel Custom Control

In the next post, I’ll show you how I’ve set up an application layout custom control, that’ll allow us to use a side bar for the form navigation.

Advertisements

Diving into Bootstrap and Font Awesome – Part 2: Enhancing the Bootstrap Panel Custom Control

As I’ve mentioned in my post “Dabbling in Bootstrap and Font Awesome Part 7: All these shiny new toys! What now?”, using responsive UI frameworks and creating web apps for mobile devices, forces us developers to rethink the way we set up an application’s UI.

With Bootstrap’s grid system, you can put content pretty much wherever you like and using Bootstrap panels, you can organize your content in a way that makes sense and looks good, be it on a desktop or a mobile device.

If you have used the Bootstrap Panel yet, you might have noticed, that it expands to the height of the content inside. That can be problematic:
Read more of this post

Dabbling in Bootstrap and Font Awesome Part 6-8: re(Use) Me! (Panel)

The Bootstrap panel can be used, to nicely organize content on your web page. In this post, I will show you how to create a reusable custom control for the panel.

Read more of this post