как сгруппировать динамически сгенерированные переключатели в «контрольную группу» в jQuery Mobile

Question

У меня проблема с группировкой динамически генерируемых переключателей в группу управления jQuery Mobile, я генерирую переключатели и добавляю их в, но они выводятся отдельно, хотя там деформация содержит роль данных «контрольной группы», вот мойHTML:

<div data-role="collapsible" data-inset="true">
    <h1>AddVote</h1>
   <div data-role="fieldcontain" >
   <form id="voting" action="get">
      <label for="name">&nbsp;&nbsp;&nbsp;&nbsp;<strong>Question:</strong></label>
<input type="text" name="name" id="name" value=""  /><br>

 <label for="name"><div id="AddButton" data-role="button" data-inline="true">AddOptions</div></label>

<input type="text" name="option" id="option" value=""  /><br>
<div id="RemoveButton" data-role="button" data-inline="true">RemoveOptions</div>




  <div  data-role="fieldcontain">
<fieldset data-role="controlgroup">
    <legend>&nbsp;&nbsp;&nbsp;&nbsp;<strong>Choose an Option:</strong></legend><br><br>
     <fieldset data-role="controlgroup">
    <div id="after" data-role="controlgroup" >

     ///////////////////////Generated radio buttons goes here//////////////////////
    </div>
    </fieldset>
    </fieldset>


  </div>
    </div>
   <a href="#" data-role="button" data-inline="true" >Publish</a>
    </form>

и вот код сценария:

function createRadioElement(elem, label, checked) {
var id = 'option1_' + label;

$('#after').append($('<input />', {
    'type': 'radio',
    'name': 'option1',
    'id': id,
    'data-role': 'controlgroup',
    'data-theme':'e',
    'value': '1'

 }));
$('#after').append('<label for="' + id + '">' 
                    + label + '</label><br />').trigger('create');

     }

$( '#admin' ).live( 'pageinit',function(event){
 $('#AddButton').click(function(){
var x = document.getElementById('option').value;     
createRadioElement(this,$('#option').val(),true);

});

Answer 1

Возможно, я не правильно понимаю вопрос, но действительно ли вас беспокоит <br /> между радиокнопками?В этом случае просто замените это:

$('#after').append('<label for="' + id + '">' 
                    + label + '</label><br />').trigger('create');

на это:

$('#after').append('<label for="' + id + '">' 
                    + label + '</label>').trigger('create');

Также я считаю, что ваши теги <form> и <div> неправильно вложены.