Rendering form elements in split button lists?
I'd like to be able to render form elements in split button lists and use the second anchor as a popup trigger (to display help content about individual fields for example).
The simple approach of wrapping the form content in a pair of anchors *almost* works.
<ul data-role="listview" data-inset="true">
<li data-role="fieldcontain">
<a>
<label for="pname">Name</label>
<input data-mini="true" name="pname" id="pname" type="text"/></input>
</a><a data-bind="event: { click: $parent.splitButtonHandler }"></a>
</li>
<li data-role="fieldcontain">
<a>
<label for="pemail">Email</label>
<input data-mini="true" name="pemail" id="pemail" type="text"/></input>
</a><a data-bind="event: { click: $parent.splitButtonHandler }"></a>
</li>
</ul>
The problem with this markup is that only the focused row renders its form element - all others render a static label with the text '...'. The focus follows the selected row though, which means that the label changes to an input etc., and this would be ok (nice actually) if the label retained the current value in string form but it doesn't and I can't find in the markup where the static '...' is being set.
Any suggestions about how to either resolve this or achieve the same result? (forms with a trailing anchor/row?). Seems like it would be a generally useful feature.
I'm using 1.20 alpha.
Tq