OnSen UI version 2.10.0 was just released with the introduction of list-item with expandable content.
My question is: how the i make the expandable content of the list-item visible by default (i.e. when the list-item is first displayed)? Presently, expandable contents are hidden until the user taps on the list-item.

Thanks

@Fran-Diox Yeah. ok. I’ll have to use media queries. But i was hoping to have something quick and simple without having to write my own bunch of rules to create responsiveness.

Thanks for your response though, I appreciate it 👍

Hello OnSen Team.

I am developing an app; i would like to make the ui layout of the app responsive for phones and tablets.
I want to create a responsive 2-column row layout for phones and 3-column row layout for tablet.
I was hoping this could be done simply and neatly using the <ons-if></ons-if> web component; unfortunately, the component does not have a ‘device’ attribute which can be set to ‘either phone’ OR ‘tablet’.
Please how can i achieve this type of responsive layout design with OnSen (something similar to how bootstrap allows responsive design).

Also, it would be lovely if my suggested ‘device’ attribute could be added to the ons-if component in future updates.

Thanks for the awesome work.

@Fran-Diox @munsterlander thanks for your explanations. This has helped to clarify alot of things.
Please one more question. Assuming i have this code:

<ons-splitter>
  <ons-splitter-side id="menu" side="left" width="220px" collapse swipeable>
    <ons-page>
      <ons-list>
        <ons-list-item onclick="fn.load('home.html')" tappable>
          Home
        </ons-list-item>
        <ons-list-item onclick="fn.load('settings.html')" tappable>
          Settings
        </ons-list-item>
        <ons-list-item onclick="fn.load('about.html')" tappable>
          About
        </ons-list-item>
      </ons-list>
    </ons-page>
  </ons-splitter-side>
  <ons-splitter-content id="content">
    <ons-navigator id="myNavigator">
      <ons-page id="page1">
        <ons-toolbar>
         <div class="center">Page 1</div>
       </ons-toolbar>
       <p>This is the first page.</p>
      <ons-button id="push-button">Push page</ons-button>
     </ons-page>
    </ons-navigator>
</ons-splitter-content>
</ons-splitter>

This code shows ons-splitter that contains a ons-navigator, the navigator in turn contains a ons-page.
Each of these elements has an onDeviceBackButton property. So, in what order will onsen listen for the backbutton event?
My understanding is: it will start with the inner most element i.e. ons-paqe, then ons-navigator, then ons-splitter.; depending on which of these has an onDeviceBackButton set.
Please is my understanding accurate?

Thank you

Please does anyone have any insight into this yet?
Thank you

Hello.
Please what’s the best way to use ons.enableDeviceBackButtonHandler()?
Should it be placed in the callback function for ons.ready() ?
E.g.

ons.ready(function () {

            ons.enableDeviceBackButtonHandler();
            ons.setDefaultDeviceBackButtonListener(function(){});
});

Furthermore, since ons.enableDeviceBackButtonHandler() relies on cordova.js should i wait for the cordova deviceready event before calling this method??

Please, i ask this question because the documentation is not clear on this; and in my apps, i always end up with a race condition which makes ons.enableDeviceBackButtonHandler() not capture the device backbutton event.

Thanks for your help and attention

@munsterlander unfortunately, the app is a commercial product and i’m bound by NDA/confidentiality agreements. Have you or anyone you know experienced this type of behaviour from the onDeviceBackButton property??

Thank you for assisting

Hello.
Please the ons.setDefaultDeviceBackButtonListener() method and the individual onDeviceBackButton page property does not work when i click my device back button for the first time, but they respond on subsequent clicks.
Please does anyone know what could be the cause of this?? Really desperate, I’ve been trying to debug this for over 2 hours.

Thank you