如何將數據導入fancybox？

Question

我完全處女對jQuery一般。 PHP是我的一杯茶，由於一般的編程知識，我或多或少地理解JavaScript。我正在爲音樂節做一些志願者工作，並接受了一個完整的設計，在那裏我「只是」必須實施PHP才能運作。

大多數工作上的事情，但也有一個（或實際上，但其他人會爲更高版本）大問題，我的谷歌，富似乎無法克服......

我有一些數據從一個數據庫列出。在每行的末尾，有一個刪除按鈕。如果我真的想刪除（不是由我自己創建的），那麼刪除按鈕現在會打開一個確認框。我不能爲我的生活似乎明白如何處理fancybox ...

這是刪除按鈕在每行的末尾（也很多花哨的CSS使這看起來不錯..）：

<a class="fadein dialog" href="#delete" title="Delete"></a>'; 

我有這個JavaScript（除其他外，這應該是相關部分）：

$(".dialog").fancybox({ 
      width   : 400, 
      height   : 160, 
      fitToView  : false, 
      autoSize  : false, 
      modal   : true, 
      closeClick  : false 
      }); 

而且這個網站再次：

<div id="delete" style="display:none; width:400px; overflow:hidden;"> 
<div class="alertwrap"> 
<h2><img src="images/shiftdelete.png" width="32" height="32" class="icon" alt="Delete" />Confirm deletion</h2> 
<div class="content"> 
<span>Are you sure you want to delete?</span> 
<a href="javascript:$.fancybox.close();" class="confirm">YES</a> 
<a href="javascript:$.fancybox.close();" class="decline">No</a> 
</div> 

很容易把行的id作爲打開fancybox的id。但我找不到在fancybox中找回它的方法，以便我可以用它來做點什麼......

按鈕的動作顯然是假的，我剛剛把它們留在了那裏，試圖理解什麼在這裏做。沒有按鈕是好的，但yes-按鈕應該能夠調用另一個php文件與後數據至少從它得到的原始編號...

我的其他問題是類似的，我猜測它可能以同樣的方式解決......我還在每一行上都有一個編輯按鈕，它以與此確認對話框相同的方式打開表單。我需要使用該行中的數據填充該表單。我真的似乎無法理解如何......

有什麼建議嗎？拜託糖頂部:)

Answer 1

見例如here

示例代碼：

$('a.btn-delete-row').click(function(){ 

    $('#delete').data('context', $(this)); 

    $.fancybox({ 
     width   : 400, 
     height   : 160, 
     fitToView  : false, 
     autoSize  : false, 
     modal   : true, 
     closeClick  : false, 
     href   : '#delete'  
    });  
}); 

$('a.confirm').click(function(){ 
    var $context = $('#delete').data('context') 

    alert($context.attr('data-rowID'));  

    $.fancybox.close(); 
    return false; 
}); 

$('a.decline').click(function(){ 
    $.fancybox.close();  
    return false; 
}); 

exsample HTML：

<a class="fadein btn-delete-row" href="javascript:void(0);" title="Delete" data-rowID="1">delete in row 1</a><br/> 
<a class="fadein btn-delete-row" href="javascript:void(0);" title="Delete" data-rowID="2">delete in row 2</a> 



<div style="display:none;"> 
    <div id="delete" style="width:400px; overflow:hidden;"> 
     <div class="alertwrap"> 
      <h2><img src="images/shiftdelete.png" width="32" height="32" class="icon" alt="Delete"/>Confirm deletion</h2> 

      <div class="content"> 
       <span>Are you sure you want to delete?</span> 
       <a href="javascript:void(0);" class="confirm">YES</a> 
       <a href="javascript:void(0);" class="decline">No</a> 
      </div> 
     </div> 
    </div>  
</div>