Support Article
Responsive UI does not work in a tablet or mobile device
SA-78243
Summary
In a tablet or a mobile device, the Right or Left swipe from the data grid in a Layout group does not work.
Error Messages
Not Applicable
Steps to Reproduce
- Launch the Case Manager portal
- Open the grid report on the tablet. Unable to swipe left or right.
Root Cause
A defect in Pegasystems’ code or rules.
In a tablet or a mobile device, the grid table scroll properties are not present due to the fixed DIV width of the screen body.
Resolution
As a local-change, add the below CSS in the harness level custom CSS file:
<style>
@media (min-width: 768px) and (max-width: 1024px) {
div[node_name="DealerSearchResultsUnqualified"] .gridTable tbody tr td:nth-child(2).mainGridTableCell {
max-width: 750px;
}
div[node_name="DealerSearchResultsUnqualified"] .gridTable tbody tr td:nth-child(2).mainGridTableCell #gridBody_right {
overflow-x: scroll;
}
} @media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
div[node_name="DealerSearchResultsUnqualified"] .gridTable tbody tr td:nth-child(2).mainGridTableCell {
max-width: 1000px;
}
div[node_name="DealerSearchResultsUnqualified"] .gridTable tbody tr td:nth-child(2).mainGridTableCell #gridBody_right {
overflow-x: scroll;
}
}
@media (min-width: 481px) and (max-width: 767px) {
div[node_name="DealerSearchResultsUnqualified"] .gridTable tbody tr td:nth-child(2).mainGridTableCell {
max-width: 400px;
}
div[node_name="DealerSearchResultsUnqualified"] .gridTable tbody tr td:nth-child(2).mainGridTableCell #gridBody_right {
overflow-x: scroll;
}
}
</style>
Published August 15, 2019 - Updated October 8, 2020
Have a question? Get answers now.
Visit the Collaboration Center to ask questions, engage in discussions, share ideas, and help others.