当在ajax弹出窗口中使用时,CK Editor无法正常工作

时间:2013-01-26 18:39:48

标签: php jquery ckeditor

在我的项目中,CKEditor用于richtext接口。问题是:- 我有一个jquery弹出框。在显示此弹出框之前,我在获取记录后向服务器发出ajax调用以获取记录,它显示了编辑记录的编辑界面,我需要整合CKEditor的textarea。当我集成编辑器时,文本区域成功更改为编辑器,但它没有在文本区域内显示文本。我可以看到textarea填充了firebug中的文本,但编辑器是空白的,无法编辑。

这是我的代码

这是主页

<?php $this->load->view('menu'); ?>
<div id="rightContent">
    <h3>Events&nbsp;&&nbsp;News</h3>
    <div align="right">
    <?php echo anchor('eventsandnews/add','ADD NEW',array('class'=>'button')); ?>
    </div>
        <div class="sukses" style="display:none;">

        </div>
        <table class="data">
            <tr class="data">
                <th class="data" width="30">No</th>
                <th class="data">Text</th>
                <th class="data">Date</th>
                <th class="data" width="75">Actions</th>
            </tr>
            <?php 
            $i=1;
            foreach ($query->result() as $row){ ?>
            <tr class="data" id="an<?php echo $row->id; ?>">
                <td class="data" width="30"><?php echo $i; ?></td>
                <td class="data"><?php echo substr($row->newstxt,0,30); ?></td>
                <td class="data"><?php echo $row->ndate; ?></td>
                <td class="data" width="75">
                <center>
                <a href="<?php echo $row->id; ?>" id="edit" class="edit" name="edit"><img src="<?php echo base_url(); ?>mos-css/img/edit.png"></a>&nbsp;&nbsp;&nbsp;
                <a href="<?php echo $row->id; ?>" id="delete" class="delete" name="delete"><img src="<?php echo base_url(); ?>mos-css/img/delete.png"></a>
                </center>               </td>
            </tr>
            <?php
            $i++;
             } ?>
        </table>
        <div id="paging">
        <?php echo $paging; ?>
        </div>
</div>
<script>
  $(function() {  
  $( "#dialog" ).dialog({
      autoOpen: false,
      height: 350,
      width: 500,
      show: {
        effect: "slide",
        duration: 500
      },
      hide: {
        effect: "slide",
        duration: 500
      }
    });
    $(".edit").click(function(event){
        event.preventDefault();
        var id = $(this).attr("href");      
        $.ajax({
            url: '<?php echo site_url().'eventsandnews/edit/'; ?>'+id,
            success: function(data) {
            $("#dialog").html(data);
            $( "#dialog" ).dialog( "open" );
            debugger;
            CKEDITOR.replace( 'update' );

            }
        });
    });

    $(".delete").click(function(event){
        event.preventDefault();
        var v = confirm('Are you sure to delete?');
        if(v==true){
            var id = $(this).attr("href");      
            $.ajax({
                url: '<?php echo site_url().'eventsandnews/delete/'; ?>'+id,
                success: function(data) {
                    $('.sukses').html('Deleted successfully');
                    $('#an' +id).remove();
                    $('.sukses').show('slow');
                     setTimeout(function() {
                        $('.sukses').hide('slow');
                      }, 2500);
                }
            });
        }

    }); 


  });
  </script>

<div id="dialog" title="Edit">

</div>

这是Ajax页面

<script>
$(document).ready(function(){
    $( "#eventsandnewsdate" ).datepicker();
    $( "#eventsandnewsdate" ).datepicker( "option", "dateFormat", "dd/mm/yy" );

    $("#sub").click(function(){
     var a =    $("#update").val();
        if($.trim(a)==''){
            $('.gagal').html('Must enter a announcement !');
            $('.gagal').show('slow');           
        }else{
            var hiddenid = $('#id').val();
            var text = $('#update').val();
            $.ajax({
              type: "POST",
              url: "<?php echo site_url().'announcements/update/'; ?>",
              data: { id: hiddenid, announce: text }
            }).done(function( msg ) {
                if(msg==1){
                    $( "#dialog" ).dialog( "close" );
                    setTimeout(function() {
                        document.location.reload();
                     }, 600);

                }
            });

            ;
        }       
    });
});
</script>
<div class="gagal" style="display:none;">

</div>
<table width="95%">         
            <tr>
              <td><strong>Annoucement</strong></td>
              <td><textarea onclick="$('.gagal').hide('slow');" name="update" id="update" ><?php echo $query[0]['atext']; ?>
              </textarea></td>
  </tr>
            <tr>
            <td width="125">Date</td><td>&nbsp;</td></tr>
            <tr><td></td><td><input type="button" class="button" id="sub" name="sub" value="Submit">
            <input type="hidden" name="id" id="id" value="<?php echo $id; ?>">
            </td></tr>
        </table>

有人可以帮助我吗?

1 个答案:

答案 0 :(得分:0)

如果我理解正确,您在CKEditor加载后尝试直接影响textarea字段。此外,您似乎使用了错误的方法。

你试过这个: CKEDITOR.editor.html#setData

在你的情况下,它会像(来自他们的文档)

CKEDITOR.instances.editor1.setData( '<p>This is the editor data.</p>' );