ListView를 동적으로 추가하지 마세요. jQuery Mobile CSS를 렌더링하지 않습니다.

목록 항목이있는 목록보기를 jQuery 모바일 접이식 격자에 추가하고 있습니다. 여기 내 Default.js 코드ListView를 동적으로 추가하지 마세요. jQuery Mobile CSS를 렌더링하지 않습니다.

$(document).ready(function() { 


    var appNames = getApprovalNames(phone, pin); 

    for (var i = 0; i < appNames.length; i++) { 

     var header = '<h3>' + appNames[i].Name + '</h3>'; 

     var ulHeader = '<ul data-role="listview" id="myAppsSectionGridTable">'; 

     var approvals = getApprovalInformation(phone, pin, appNames[i].Name); 

     var listArray = new Array(); 


     for (var j; j < approvals.length; j++) { 

      var link = '<li><a href="' + 'NickData' + '"' + '><img src="'; 
      var detailHeader = '" alt="" class="ui-li-icon"/>' + '<h3>' + 'NickData' + '</h3>'; 
      var detail = '<p>' + 'NickData' + '</p>' + '</a>' + '</li>'; 

      var list_item = link + detailHeader + detail; 

      listArray.push(list_item); 

     } 

    var entire_list = null; 

    for (var y in listArray) { 

     entire_list = entire_list + listArray[y]; 

    } 

    $('#accMain').append(header + ulHeader + entire_list + '</ul>'); 

    } 

});

입니다이 코드는 화면에 있지만, 화면의 아무 곳이나 어떤 jQuery를 모바일 CSS를 사용하여 데이터를 표시합니다. 또한 소스에서 볼 때 거기에 새로 만든 마크 업이 표시되지 않습니다. 틀린 사건이나 다른 것에 이것을 추가합니까? 페이지의 마크 업을 하드 코딩하면 모든 것이 올바르게 작동합니다. 동적으로 jQuery 모바일 마크 업을 추가하는 것과 관련이 있습니다. 그냥 기존의 목록보기에 내용을 추가하는 경우

$('#mylist').listview()

후 전화

<asp:Content ID="HContent" ContentPlaceHolderID="HeadContent" runat="server"> 

<script src="Js/Pages/Default.js" type="text/javascript"></script> 

</asp:Content> 
<asp:Content ID="THContent" ContentPlaceHolderID="TopHeaderContent" runat="server"> 
    <h1> 
     Applications</h1> 
</asp:Content> 
<asp:Content ID="MContent" ContentPlaceHolderID="MainContent" runat="server"> 

<div id="accMain" data-role="collapsible" data-inset="false" data-collapsed="false"> 

</div> 

</asp:Content>

이에 대한이 마스터 페이지 본문입니다 ..

<body> 

<div data-role="page" data-theme="b"> 

    <div data-role="header" data-position="fixed"> 

     <asp:ContentPlaceHolder ID="TopHeaderContent" runat="server"></asp:ContentPlaceHolder> 


    </div><!-- /header --> 

    <div data-role="content"> 

<asp:ContentPlaceHolder ID="MainContent" runat="server"></asp:ContentPlaceHolder> 

    </div><!-- /content --> 

    <div data-role="footer" data-position="fixed"> 
    <asp:ContentPlaceHolder ID="FooterContent" runat="server"></asp:ContentPlaceHolder> 


    </div><!-- /footer --> 

</div><!-- /page --> 

</body>

출처

2012-08-28 Nick LaMarca

당신은 listview 방법을 호출 할 필요가 refresh 방법

$('#mylist').listview('refresh');

여러 위젯 당신이 만드는 이벤트

에게 트리거링을 시도 할 수 있습니다 후 개선 할 필요가/항목을 추가하는 경우3210

언젠가 당신이 당신의 pageshow 이벤트에 전화를 다음

$('#myPage').on('pageshow', function() { 
    try 
    { 
     $('#mylist').listview('refresh'); 
    } catch (e) { 
    $('#mylist').listview(); 
    } 
});

뭔가를해야 할 수도 있습니다

$('#myPage').trigger('create');

출처

2012-08-28 15:56:00 Jack

문서 준비가 끝나면 페이지 쇼 이벤트가 시작됩니까? –

JQM은 [pageshow] (http://jquerymobile.com/demos/1.1.1/docs/api/events.html)'이벤트 '를 발생시킵니다. 예제는 내가 바인딩 한 것입니다. 당신이 당신의 목록을 추가하기 전에 당신이 바인딩 할 수있는'DOM'에 이미 있습니다. – Jack

접을 수있는 목록이 렌더링되지 않습니다. 나는 어떻게 든 그것을 새롭게해야 하느냐?? –

ListView를 동적으로 추가하지 마세요. jQuery Mobile CSS를 렌더링하지 않습니다.

답변

관련 문제