1

我正在尝试实现一个里面有单选按钮的horizontal control group。jquery mobile我正在尝试dynamically从code behind.
这些单选按钮位于 for 循环中。 

StringBuilder tileString = new StringBuilder(string.Empty);     

foreach (Product product in productsInCart)
        {               
            tileString.Append("<div><legend >Choose shipping type:</legend></div><br />");

            tileString.Append("<input type='radio' name='radio-choice-1' id='radio-choice-1' onclick='findPaymentMethod()' value='In Flight' checked='checked' />");

            tileString.Append("<label for='radio-choice-1'>In flight</label>");

            tileString.Append("<input type='radio' name='radio-choice-1' id='radio-choice-2' value='On Arrival' onclick='findPaymentMethod()' />");

            tileString.Append("<label for='radio-choice-2'>On Arrival</label>");                           
        } `

如您所见，第一个单选按钮上有一个属性。

checked='checked'

但是，当它在 for 循环中运行时，只会检查 for 循环中的最后一个单选元素。谁能建议我代码有什么问题？或者我在这里错过了什么？

编辑： 添加生成的 HTML 字符串。

<div data-role='fieldcontain'>
            <fieldset data-role='controlgroup' data-type='horizontal' id='6' data-mini='true'>
              <div>
                <legend >Choose shipping type:</legend>
              </div>
              <br />
              <input type='radio' name='radio-choice-1' id='radio-choice-16'  value='In Flight' checked='checked'/>
              <label for='radio-choice-16'>In flight</label>
              <input type='radio' name='radio-choice-1' id='radio-choice-26' value='On Arrival'  />
              <label for='radio-choice-26'>On Arrival</label>
            </fieldset>
          </div>`

`<div data-role='fieldcontain'>
            <fieldset data-role='controlgroup' data-type='horizontal' id='1' data-mini='true'>
              <div>
                <legend >Choose shipping type:</legend>
              </div>
              <br />
              <input type='radio' name='radio-choice-1' id='radio-choice-11'  value='In Flight' checked='checked'/>
              <label for='radio-choice-11'>In flight</label>
              <input type='radio' name='radio-choice-1' id='radio-choice-21' value='On Arrival'  />
              <label for='radio-choice-21'>On Arrival</label>
            </fieldset>
          </div>

只有 1 个单选元素在fieldset

这是所需效果的图像。

4

1 回答 1

0

您的 name 属性（如 id one）必须是唯一的。

工作示例：http: //jsfiddle.net/Gajotres/SBxVc/

<div data-role='fieldcontain'>
     <fieldset data-role='controlgroup' data-type='horizontal' id='6' data-mini='true'>
         <div>
             <legend >Choose shipping type:</legend>
         </div>
         <br />
         <input type='radio' name='radio-choice-16' id='radio-choice-16'  value='In Flight' checked='checked'/>
         <label for='radio-choice-16'>In flight</label>
         <input type='radio' name='radio-choice-26' id='radio-choice-26' value='On Arrival'  />
         <label for='radio-choice-26'>On Arrival</label>
     </fieldset>
</div>

<div data-role='fieldcontain'>
    <fieldset data-role='controlgroup' data-type='horizontal' id='1' data-mini='true'>
        <div>
            <legend >Choose shipping type:</legend>
        </div>
        <br />
        <input type='radio' name='radio-choice-11' id='radio-choice-11'  value='In Flight' checked='checked'/>
        <label for='radio-choice-11'>In flight</label>
        <input type='radio' name='radio-choice-21' id='radio-choice-21' value='On Arrival'  />
        <label for='radio-choice-21'>On Arrival</label>
    </fieldset>
</div>
于 2013-02-23T11:19:06.700 回答