1

内部にラジオボタンがあるを実装しようとしhorizontal control groupています。からjquery mobileHTML 文字列を作成しようとしています。 これらのラジオ ボタンは for ループにあります。 dynamicallycode behind

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 属性など) は一意である必要があります。

作業例: 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 に答える