CODEWITHSUNDEEP
paginationsapui5
Adam Harkus
Adam Harkus

Reputation: 2210

SAPUI5 - Mobile app paging, alternatives to paginator

I'm investing a survey / questionnaire app in SAPUI5...

As it's mainly to be used on a mobile device, and the questionnaires will consist of many questions, what are the best SAPUI5 components to use for paging through the questions?

Paginator is ugly and will be deprecated soon, so I'm looking for alternative suggestions.

Can anyone help?

Upvotes: 0

Views: 1197

Answers (3)

Adam Harkus
Adam Harkus

Reputation: 2210

Thanks for all you help on this. I'd like to use binding path/context to create a new survey create app, but just need some examples of manipulating the binding to create a new path for example, I've created a new question here

Upvotes: 0

user7671542
user7671542

Reputation:

I know the question is already answered by Allen, so this is an alternavtive suggestion.

Assuming that your model will be something like:

{
    "Questions": [{
        "QuestionID": "0001",
        "QuestionText":"What is a Blah?"
        "Options": [{
            "OptionA":"Blah",
            "OptionB":"BlahBlah",
            "OptionC":"BlahBlahBlah",
            "OptionD":"None Of the Above Blahs"
        }]
        },{
        "QuestionID": "0002",
        "QuestionText":"To Blah or not to Blah?"
        "Options": [{
            "OptionA":"Yes",
            "OptionB":"No",
            "OptionC":"Blah",
            "OptionD":"Blah ha ha ha"
        }]
    }]
}

You can also accomplish the same effect without a NavContainer and a Single View. The View will be bound to the above model. The View / Page might have two buttons for the "next" and "previous" functionality. On click of each button you can manipulate the BindingContext that is bound to the view so that the Context changes and not the view. To set a new BindingContext, you can track which question is currently displayed on the screen and use the .bindElement function to set the Path of the next / previous element to be displayed.

  • Pros: Only one View and Controller
  • Cons: Need to manage the context and paths, Also means that the binding is little more complex and you might need factory functions based on whether the number of answers can vary between 2 (True / False questions) to 4 (MCP as in the above example)

Helpful link for Element Binding: https://sapui5.hana.ondemand.com/explored.html#/sample/sap.ui.core.tutorial.databinding.13/preview

Upvotes: 0

Haojie
Haojie

Reputation: 5713

how about NavContainer. https://sapui5.hana.ondemand.com/explored.html#/sample/sap.m.sample.NavContainer/preview

It is very good fit for your use case , and it has good user experience in mobile devices. You can define your own Back and Next button in the footer to navigate between different questions.

Thank you.

Upvotes: 1

Related Questions