2012-11-23 4 views
0

jquery mobile을 사용하여 동적으로 listview를 생성하고 싶습니다. 난 단지 목록 항목을 생성하는 경우ajax에서 동적으로 목록보기 생성 - 새로 고침이 작동하지 않음

<div id="content" data-role="content">  
</div><!-- /content --> 

<script type="text/javascript"> 
    $.ajax({ 
     type: "GET", 
     url: "my.json", 
     dataType: "json", 
     success: function(articles) { 
      var html = '<ul id="hellolist" data-role="listview"><li><h3>One</h3></li><li><h3>Two</h3></li><li><h3>Three</h3></li></ul>';    
      $('#content').append($(html)); 
      $('#hellolist').listview('refresh'); 
     }        
    }); 
</script> 

또는 나는 아약스 새로 고침이 잘 목록보기 형식을 사용하지 않는 :이 코드 만 .listview ('새로 고침') 작동하지 않는 경우가 있습니다.

시험 # 1 : 잘 작동합니다.

<div id="content" data-role="content"> 
    <ul id="hellolist" data-role="listview"> </ul> 
</div><!-- /content --> 

<script type="text/javascript"> 
     var html = '<li><h3>One</h3></li><li><h3>Two</h3></li><li><h3>Three</h3></li>';    
     $('#hellolist').append($(html)); 
     $('#hellolist').listview('refresh'); 
</script> 

시험 # 2 : 잘 작동합니다.

<div id="content" data-role="content">  
</div><!-- /content --> 

<script type="text/javascript"> 
     var html = '<ul id="hellolist" data-role="listview"><li><h3>One</h3></li><li><h3>Two</h3></li><li><h3>Three</h3></li></ul>';    
     $('#content').append($(html)); 
     $('#hellolist').listview('refresh'); 
</script> 

테스트 # 3 : 잘 작동합니다.

<div id="content" data-role="content"> 
    <ul id="hellolist" data-role="listview"> </ul>  
</div><!-- /content --> 

<script type="text/javascript"> 
    $.ajax({ 
     type: "GET", 
     url: "my.json", 
     dataType: "json", 
     success: function(articles) { 
      var html = '<li><h3>One</h3></li><li><h3>Two</h3></li><li><h3>Three</h3></li>';    
      $('#hellolist').append($(html)); 
      $('#hellolist').listview('refresh'); 
     }        
    }); 
</script> 

아무도이 문제를 해결할 생각이 있습니까?

답변

1

, 당신은 대신 .listview의 방법 (' "생성)을 .trigger를 호출 시도 할 수 있습니다 () "새로 고침";

을 그건 그냥() .listview 호출하려고 작동하지 않으면하며 PARAM를 '새로 고침'없이

을 그래서, 기본적으로, 대신

의.
$('#hellolist').listview('refresh'); 

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

또는

$('#hellolist').listview(); 

행운

을 시도해보십시오.

편집 : 여전히 문제가 해결되지 않으면 새 목록이 포함 된 페이지에서 create 이벤트를 실행 해보십시오.

+0

감사합니다,이 솔루션 : $ ('# hellolist'). listview(); – matyig

0

UL 태그를 추가하기 때문에 첫 번째 태그가 작동하지 않습니다. 'LI'태그 만 추가하려고하면 UL은 이미 html 구조에 있어야합니다. 당신의 HTML에서

var html = '<li><h3>One</h3></li><li><h3>Two</h3></li><li><h3>Three</h3></li>'; 

: 당신은 HTML의 빈 UL 태그를 원하지 않는 경우

<ul data-role="listview" id="" data-split-icon="gear" data-split-theme="a" ></ul> 
+1

나는 그가 그렇게 작동한다는 것을 알고 있다고 생각합니다. 게시물에서 테스트 3을 참조하십시오. 요점은, 만약 내가 올바르게 이해한다면, 그는 ul을 동적으로 추가하기를 원한다는 것입니다. – Aaron

+0

괜찮아, 내 최선의 시도를 시도 –

관련 문제