2011-10-06 3 views
0

같은 페이지 내에서 인라인 콘텐츠를 사용하여 jQuery Mobile dialog을 만들 수 있습니까? 예를 들어인라인 컨텐츠의 대화 상자가 가능합니까?

:

<div data-role="page"> 
    <div data-role="content"> 

     <!-- this causes the entire current page to load as the dialog --> 
     <a href="#modal" data-rel="dialog">Open Dialog<a> 

     <div id="modal" style="display: none"> 
      Hello World 
     </div> 

    </div> 
</div> 

전형적인 대화가 연결 객체의 HREF 측면을 따라 현재 페이지 앉는 개별 "페이지", 또는 하나의 것이 필요

<div data-role="page"> 
    <div data-role="content"> 
     <a href="#modal" data-rel="dialog">Open Dialog<a> 
    </div> 
</div> 
<div data-role="page" id="modal"> 
    <div data-role="content"> 
     Hello World 
    </div> 
</div> 

그러나 내 템플릿 구조로 인해 링크가 모달 콘텐츠와 분리되지 않습니다. 가능하다면 모듈화 된 것을 하나의 플러그 가능한 컨트롤로 유지하고 싶습니다. 현재의 CMS 프레임 워크 (Sitecore)를 사용하면 모달 콘텐츠 용으로 완전히 새로운 외부 페이지를 만드는 것이 번거로울 수 있습니다.

+0

당신이 어떤 해결책을 발견 할 수 있습니다? – Nachiket

+0

Nachiket이 답변을 찾았습니다 –

답변

1

jQueryMobile은 - SimpleDialog2 인라인 대화 http://dev.jtsage.com/jQM-SimpleDialog/demos2/

<a href="#" id="opendialog" data-role="button">Open Dialog</a> 


    <div id="inlinecontent" style="display:none" data-options='{"mode":"blank","headerText":"Yo","headerClose":true,"blankContent":true}'> 

<ul data-role='listview'><li>Some</li><li>List</li><li>Items</li></ul> 
<a rel='close' data-role='button' href='#'>Close</a> 
</div> 

$(document).delegate('#opendialog', 'click', function() { 
// NOTE: The selector is the hidden DIV element. 
$('#inlinecontent').simpledialog2(); 
}) 
관련 문제