jquery mobile - ajax loading checkboxes for for loop не работает с .trigger()

Question

Так что это проблема, которую я видел по всему Интернету, но я не могу за всю жизнь понять, почему это не сработает.

Для людей, у которых будет представление о том, что я пытаюсь, я загрузил статические материалы ввода, используя .html (contentVariable), и он отлично работает, но как только я установил создание флажка в цикле for, все идет к банк, и только первый элемент флажка, кажется, работает и имеет стили.

Так что я запускаю запрос на сервере, который возвращает объект json, чтобы заполнить мои флажки. В JS я использую ajax, чтобы получить этот объект json и пропустить содержимое, чтобы заполнить флажки. Переменная «result» в приведенном ниже примере возвращает 3 результата, и эта сторона вещей работает нормально (если люди понимают, что на самом деле я не повторяю результаты от возвращаемого объекта).

Так что я предполагаю, что я не использую .trigger() в нужном месте или правильно вообще. Любая помощь будет оценена по достоинству.

Большое спасибо.

HTML

 <!-- register page --> 
    <div data-role="page" id="two"> 
     <script type="text/javascript" src="js/friendsList.js"></script> 
     <div data-role="header"> 
      <h1>New Project</h1> 
      <a href="#two" class="ui-btn-left" data-rel="back" data-icon="back" data-transition="flip">Back</a> 
     </div> 
     <div data-role="content"> 
      <form id='registerUser' action="" method="POST"> 
       <div data-role="fieldcontain" class="checkWrap"> 

       </div> 
       <button type="button" aria-disabled="false">Submit</button> 
      </form> 
     </div> 
    </div><!-- /page two --> 

JS

$(document).delegate('#two', 'pageshow', function() { 

var userId = localStorage.getItem('userId'); 
var friendsListContent = ""; 

$.ajax({ 
    url: 'http://www.mysite.co.uk/app/friends/listFriends.php', 
    type: 'post', 
    data: {'userId': userId}, 
    dataType: 'json', 
    crossDomain : true, 
    timeout: 5000, 

    success: function(result){ 
    friendsListContent = "<fieldset data-role='controlgroup'><legend>Choose as many snacks as you'd like:</legend>"; 

     for(var i = 0; i < result.length; i++){ 
      friendsListContent += "<input type='checkbox' name='checkbox-1a' id='checkbox-1a' class='custom' /><label for='checkbox-1a'>Cheetos</label>";   
     } 

    friendsListContent += "</fieldset>"; 

    $('.checkWrap').html(friendsListContent); 
    $('.checkWrap').trigger('create'); 
    $("input[type='checkbox']").checkboxradio("create"); 
    }, 

    error: function(){ 
     alert('There was an error loading the data. Contact the admin.'); 
    } 

}); 

}); 

Answer 1

Хорошо, так что ответ является тот факт, что числа в классах и имена не были итерация с каждым из элементов CheckBox.

В течение цикла я изменил его на это ...

friendsListContent += "<input type='checkbox' name='checkbox-" + i + "a' id='checkbox-" + i + "a' class='custom' /><label for='checkbox-" + i + "a'>Cheetos</label>";