“Newbie” here, transitioning a small old mobile website from vintage framework7 v1 to new v5.7.
I had an input form with several dropdown boxes. In v1 version I just used the native input dropdown HTML tag. I have a @change function() that changes selection in dropdown box 1 when something is selected in dropdown box 3. Using the analogous kitchensink example below, let’s say next dropdown box would be “desktop-laptop”. I want to put a constrain where laptop is selected, the mac-windows selection will default back to mac.
I implemented my old input form with Smart Select bottom sheet like this kitchensink example.
Previously my old javascript would simply set mac-windows.selectedIndex=0 and the native dropdown box would reflect the change. In the new Smart Select UI, when I tap and open the bottom sheet, “Mac” is appropriately check-marked by the @change javascript, but the “item-after” gray placeholder retains the previous “Windows” selection and does not reflect the update.
I thought about using the new Picker as well.
Any insight is appreciated.
<li>
<a class="item-link smart-select smart-select-init" data-open-in="sheet">
<select name="mac-windows">
<option value="mac" selected>Mac</option>
<option value="windows">Windows</option>
</select>
<div class="item-content">
<div class="item-inner">
<div class="item-title">Mac or Windows</div>
</div>
</div>
</a>
</li>
```\