In the first part of Blog post, we covered drag and drop Portal survey creation in Rollbase. In this post, we will cover custom Survey Page using BootStrap and KendUI  which is supported by RollBase Platform. We’ll cover two scenarios of building the same Survey : using BootStrap and KendoUI

• Let’s navigate to our application and choose the portal option to enable Bootstrap and Kendo.
• Choose Survey Demo App and Navigate to Objects and Portals.

• Create a new page and choose Generic Page option where BootStrap code can be hosted.

• Choose edit option (above page) to add code — HTML + CSS  and Script need to be placed in different contains. Sample code https://gist.github.com/andybala2020/16654a4ee14842f30a1f706c469ea2c9
• In blank page, create a section and insert HTML and Script component.

• Rollbase allows user to create components via editor or import HTML Source – Before and After import 

• Save the changes and choose preview option to view the changes. sample output:  https://www.rollbase.com/prod1/portal/pPreview.jsp?c=294235521&p=311266333&g=320468790

Now Let’s create the same page using KENDOUI

• Create New Portal page using steps above.
• Choose edit page option and create a section, add HTML and Script, each being separate containers.
  • HTML section consists of text and form data ; https://gist.github.com/andybala2020/6e894145562ff2c64cc4736f3c21e158
  • Script Section: https://gist.github.com/andybala2020/b590c3bcf69f5d398dbc289c296aa6
• Script walkthrough
  • Create an array to loop through data
  • View Model to map data for Kendo
  • Using Rollbase function rbf_createRecord insert data into Rollbase after survey submission
• Final page draft view

Completed survey snapshot

Check out Rollbase and build a survey. Happy Coding.