KB Article 10324

Contact Tech Support

 Email Tech Support
 (250) 655-1766
 [7:30 - 5:00 PST]
Your Meeting ID will be Provided by a Rep.
Tech Support
Tech Support Home
Software Updates
Knowledge Base Search
Recent KB Articles
Product FAQs
Code Samples
Tech Blog
System Requirements
Installation Instructions
Support Testimonials
Contact us to...
Create a Ticket
Request a Free Demo
Suggest a New Feature
Submit Feedback
Upload a Large File
Other Services
Software Training
Professional Services

Difference between reflow and column-toggle tables in jQuery Mobile.

Product: WebSmart ILE Type: Frequently Asked Question

There two modes for your table in jQUery mobile, "column toggle" and "reflow".

  • Reflow table. Reflow tables, when on a smaller screen, keeps all of the column and re-displays them in a single column like a list.
  • Column-toggle table. Column toggle tables, on the other hand, hide columns that have been specified with higher priority value (less important). It's a reverse of what you might expect but a column with "data-priority=1" is most important. You can think of this as "first-class priority". Depending on the screen size and column width, it hides just enough columns to satisfy the minimum width.

By default, the Reflow Table template in WebSmart currently supports only the reflow mode as the name implies. However, it's fairly simple to switch it over to a column toggle table. To do so, change the data-mode to coloumntoggle and remove xl-ui-responsive class in the table tag.

Rate This Article

Did this example help you to achieve your goal?
 Yes  No  Don't Know

Enter additional comments below.   If you want to hear back from us, include your contact information.

Email Address:
Please enable JavaScript in order to rate this page.