如何獲取joomla2.5 iframe中的joomla編輯器的內容Madal框

Question

我有一個表單，我有joomla2.5編輯器。我想在Iframe Joomla2.5 Modal Box中顯示該joomla2.5編輯器的內容。 我使用joomla編輯器

<?php 
    $editor =& JFactory::getEditor(); 
    echo $editor->display('body', '', '400', '150', '20', '20', false, $params); 
?> 

此頁面處於查看文件夾中。 我使用js文件中的代碼，如window.parent.document.getElementById('body').value or window.parent.jInsertEditorText(tag, this.body);它包含在js文件中。當我嘗試提醒時，警報顯示爲空。 如何解決這個js文件。如果有機構知道，請回復。 我需要你的手。 謝謝

Answer 1

的Joomla有一個內置的方式來顯示模式框：

首先，你需要做的是問的Joomla加載模式庫：

<?php JHTML::_('behavior.modal'); ?> 

這是打開的代碼模態窗口：

<a rel="{handler: 'iframe', size: {x: 750, y: 600}}" href="url_to_modal_editor" target="_blank"> Open Modal Editor</a> 

這會在鏈接的HREF頁面（模態編輯器的頁面），可以說editor.p：

<?php 
    $editor =& JFactory::getEditor(); 
    echo $editor->display('body', '', '400', '150', '20', '20', false, $params); 
?> 

Answer 2

我在這裏寫答案，因爲評論是不是好顯示 代碼

的Joomla模式功能是很好的展現從組件的鏈接，但不允許我們打開給定頁面上的元素。因此，您需要編寫自己的代碼，首先不要覆蓋Joomla的核心，或者您下次升級時所做的所有修改都將被覆蓋。因此，假設您考慮到這一點：

1-首先要做的是，爲您的自定義模態窗口添加javascript代碼。您需要將文本容器DIV ID或類名傳遞給下面的代碼：

<script type="text/javascript"> 
$(document).ready(function(){ 
    // Main parameters: 
    // Modify texteditor-id with the id or classname on your text div. For a classname use '.' instead of '#' 
    var HTMLContent = $("#texteditor-id").html(); 

    var width = 600; 
    var height = 250; 

    $('#button').click(function(){ 
      // transparent background 
      // we create a new div, with two attributes 
      var bgdiv = $('<div>').attr({ 
            className: 'bgtransparent', 
            id: 'bgtransparent' 
            }); 

      // add the new div to the page 
      $('body').append(bgdiv); 

      // get the widht and height of the main window 
      var wscr = $(window).width(); 
      var hscr = $(window).height(); 

      // set the background dimensions 
      $('#bgtransparent').css("width", wscr); 
      $('#bgtransparent').css("height", hscr); 


      // modal window 
      // create other div for the modal window and two attributes 
      var moddiv = $('<div>').attr({ 
            className: 'bgmodal', 
            id: 'bgmodal' 
            });  

      // add div to the page 
      $('body').append(moddiv); 

      // add HTML content to the modal window 
      $('#bgmodal').append(HTMLContent); 

      // resize for center adjustment 
      $(window).resize(); 
    }); 

    $(window).resize(function(){ 
      // explorer window dimensions 
      var wscr = $(window).width(); 
      var hscr = $(window).height(); 

      // setting background dimensions 
      $('#bgtransparent').css("width", wscr); 
      $('#bgtransparent').css("height", hscr); 

      // setting modal window size 
      $('#bgmodal').css("width", ancho+'px'); 
      $('#bgmodal').css("height", alto+'px'); 

      // getting modal window size 
      var wcnt = $('#bgmodal').width(); 
      var hcnt = $('#bgmodal').height(); 

      // get central position 
      var mleft = (wscr - wcnt)/2; 
      var mtop = (hscr - hcnt)/2; 

      // setting modal window centered 
      $('#bgmodal').css("left", mleft+'px'); 
      $('#bgmodal').css("top", mtop+'px'); 
    }); 

}); 

function closeModal(){ 
    // remove created divs 
    $('#bgmodal').remove(); 
    $('#bgtransparent').remove(); 
} 
</script> 

2 - 你的預覽鏈接必須是這個樣子，最重要的部分是id =「按鈕」的一部分，因爲它會可用於由以前的jQuery代碼來標識：

<input type="button" id="button" value="Preview" /> 

3-以下代碼添加到你的CSS

.bgtransparent{ 
    position:fixed; 
    left:0; 
    top:0; 
    background-color:#000; 
    opacity:0.6; 
    filter:alpha(opacity=60); 
} 

.bgmodal{ 
    position:fixed; 
    font-family:arial; 
    font-size:1em; 
    border:0.05em solid black; 
    overflow:auto; 
    background-color:#fff; 
} 

這基本上是你需要做什麼。希望有所幫助！

Answer 3

請在定位標記中包含class =「modal」。