问题
Using asp.net <EditItemTemplate>
my JQuery Mobile results are a fixed width and will not expand out with full browser, nor will they reduce small enough for mobile? I have removed all reference to width
in all the controls?
The controls render as mobile and the <ul>
and <li>
look fine.
<ul data-role="listview" id="ul-edit-picks" data-divider-theme="a" data-inset="true">
<li>1st Week:
<asp:TextBox ID="CHOICE1TextBox" runat="server" Text='1st Week' ReadOnly="True"></asp:TextBox><br />
<asp:HiddenField ID="CHOICE1HiddenField" runat="server" Value='<%# Bind("CHOICE1")%>' />
</li>
<li>2nd Week:
<asp:TextBox ID="CHOICE2TextBox" runat="server" Text='' ReadOnly="True"></asp:TextBox><br />
<asp:HiddenField ID="CHOICE2HiddenField" runat="server" Value='<%# Bind("CHOICE2")%>' />
</li>
<li>3rd Week:
<asp:TextBox ID="CHOICE3TextBox" runat="server" Text='' ReadOnly="True"></asp:TextBox><br />
<asp:HiddenField ID="CHOICE3HiddenField" runat="server" Value='<%# Bind("CHOICE3")%>' />
</li>
<li>
<asp:Button ID="UpdateButton" runat="server" CausesValidation="True" CommandName="Update"
Text="Update Selections" ToolTip="Click to change your selections..."></asp:Button>
<asp:Button ID="UpdateCancelButton" runat="server" CausesValidation="False" CommandName="Cancel"
Text="Cancel"></asp:Button>
</li>
</ul>
HTML rendered:
<ul data-role="listview" id="ul-fdid" data-divider-theme="a" data-inset="true">
<li>FDID:
<span id="ctl00_ContentPlaceHolder1_FormView1_Label1" style="font-size:Medium;font-weight:bold;">BJ9150</span>
</li>
</ul>
<ul data-role="listview" id="ul-edit-picks" data-divider-theme="a" data-inset="true">
<li>1st Week:
<input name="ctl00$ContentPlaceHolder1$FormView1$CHOICE1TextBox" type="text" value="1st Week" readonly="readonly" id="ctl00_ContentPlaceHolder1_FormView1_CHOICE1TextBox" /><br />
<input type="hidden" name="ctl00$ContentPlaceHolder1$FormView1$CHOICE1HiddenField" id="ctl00_ContentPlaceHolder1_FormView1_CHOICE1HiddenField" value="1/19/2014 12:00:00 AM" />
</li>
<li>2nd Week:
<input name="ctl00$ContentPlaceHolder1$FormView1$CHOICE2TextBox" type="text" readonly="readonly" id="ctl00_ContentPlaceHolder1_FormView1_CHOICE2TextBox" /><br />
<input type="hidden" name="ctl00$ContentPlaceHolder1$FormView1$CHOICE2HiddenField" id="ctl00_ContentPlaceHolder1_FormView1_CHOICE2HiddenField" value="4/13/2014 12:00:00 AM" />
</li>
<li>3rd Week:
<input name="ctl00$ContentPlaceHolder1$FormView1$CHOICE3TextBox" type="text" readonly="readonly" id="ctl00_ContentPlaceHolder1_FormView1_CHOICE3TextBox" /><br />
<input type="hidden" name="ctl00$ContentPlaceHolder1$FormView1$CHOICE3HiddenField" id="ctl00_ContentPlaceHolder1_FormView1_CHOICE3HiddenField" />
</li>
<li>4th Week:
<input name="ctl00$ContentPlaceHolder1$FormView1$CHOICE4TextBox" type="text" readonly="readonly" id="ctl00_ContentPlaceHolder1_FormView1_CHOICE4TextBox" /><br />
<input type="hidden" name="ctl00$ContentPlaceHolder1$FormView1$CHOICE4HiddenField" id="ctl00_ContentPlaceHolder1_FormView1_CHOICE4HiddenField" />
</li>
<li>5th Week:
<input name="ctl00$ContentPlaceHolder1$FormView1$CHOICE5TextBox" type="text" readonly="readonly" id="ctl00_ContentPlaceHolder1_FormView1_CHOICE5TextBox" /><br />
<input type="hidden" name="ctl00$ContentPlaceHolder1$FormView1$CHOICE5HiddenField" id="ctl00_ContentPlaceHolder1_FormView1_CHOICE5HiddenField" />
</li>
<li>6th Week:
<input name="ctl00$ContentPlaceHolder1$FormView1$CHOICE6TextBox" type="text" readonly="readonly" id="ctl00_ContentPlaceHolder1_FormView1_CHOICE6TextBox" /><br />
<input type="hidden" name="ctl00$ContentPlaceHolder1$FormView1$CHOICE6HiddenField" id="ctl00_ContentPlaceHolder1_FormView1_CHOICE6HiddenField" />
</li>
<li>
<input type="submit" name="ctl00$ContentPlaceHolder1$FormView1$UpdateButton" value="Update Selections" id="ctl00_ContentPlaceHolder1_FormView1_UpdateButton" title="Click to change your selections..." />
<input type="submit" name="ctl00$ContentPlaceHolder1$FormView1$UpdateCancelButton" value="Cancel" id="ctl00_ContentPlaceHolder1_FormView1_UpdateCancelButton" />
</li>
</ul>
回答1:
Actually solved the issue: It was a <asp:label>
lower in the code that produced text that was not set to wrap.
来源:https://stackoverflow.com/questions/25645334/jquery-mobile-non-adjustable-width