Question

그 URL을 가지고

또한

<a onClick="showDialog({$product['id']});">More Info...</a> 

내가 가진 :

function showDialog(productID) 
{ 
    $("#dialog-modal_"+productID).html("<iframe src='index.php?act=showProduct&amp;id="+productID+"' width='100%' height='100%' frameborder='0' scrolling='no'></iframe>"); 
    $("#dialog-modal_"+productID).dialog({ 
    width: 810, 
    height: 590, 
    resizable: false, 
    modal: true, 
    open: function(event, ui) 
    { 
     event.preventDefault(); 
    } 
    }); 
    container 
     .dialog('option', 'title', 'Your Title') 
     .dialog('option', 'buttons', { 
      Close: function() { 
       $(this).dialog('close'); 
      } 
     }) 
     .dialog('open'); 

    var stateObj = { foo: "bar" }; 
    window.history.pushState(stateObj, "page 2", "{$info['siteurl']}/index.html#product-"+productID); 

} 

나는 그것이 작동하고 일단을 열면,하지만 난 다시 한 번 시도하는 경우, 그것은 개방되지 않는다 . 현재 ID의 마지막 대화 상자를 "지우는"방법을 찾아야합니다. 다른 대화 상자의 경우 작동하지만 단 한 번. 제품 루프 내부

Answer 1

:

<a href="javascript:" class="productOpener" data-id="{$product['id']}">more info...</a> 

그리고 당신의 자바 스크립트 :

$(".productOpener").click(function() { 
    showDialog($(this).data("id")); 
}); 

및 수정 showDialog 당신이 그것을 필요로 할 때 바로 모달 DIV를 만들려면 다음

function showDialog(productID) { 
    var _modal = $("<div/>"); //add whatever styling you need 
    _modal.html("<iframe src='index.php?act=showProduct&amp;id="+productID+"' width='100%' height='100%' frameborder='0' scrolling='no'></iframe>"); 
    _modal.dialog({ ... }); 
    ... 
}