admin管理员组

文章数量:1336394

I am using custom form and generating form elements with ajax call but textarea is not loaded with ckeditor. Here is my code:

ajax code:

    jQuery.ajax({
    type: "POST",
    url: "reg_arz_ajax2.php",
    data: "book="+book_arzyabi,
    dataType : "html",
    success: function(response){

        $('#resp').html(response);
    },
    error:function (xhr, ajaxOptions, thrownError){
        //On error, we alert user
        alert(thrownError);
    }
});

$( "#dialog-form" ).dialog( "open");

});

ajax response is:

   '<textarea class="ckeditor" cols="80" id="fname" name="fname" rows="10" >test</textarea>';

html code:

  <html>
 <head>
 <script type="text/javascript" src="../include/ckeditor/ckeditor.js"></script>
 <script type="text/javascript" src="../include/ckeditor/sample.js" ></script>
 </head>

 <body>
 <form>
 <fieldset>
 <label for="name">Name</label>
 <div id="resp" ></div>
 </fieldset>
 </form>
 </body>
 </html>

Please help me for resolve problem.

I am using custom form and generating form elements with ajax call but textarea is not loaded with ckeditor. Here is my code:

ajax code:

    jQuery.ajax({
    type: "POST",
    url: "reg_arz_ajax2.php",
    data: "book="+book_arzyabi,
    dataType : "html",
    success: function(response){

        $('#resp').html(response);
    },
    error:function (xhr, ajaxOptions, thrownError){
        //On error, we alert user
        alert(thrownError);
    }
});

$( "#dialog-form" ).dialog( "open");

});

ajax response is:

   '<textarea class="ckeditor" cols="80" id="fname" name="fname" rows="10" >test</textarea>';

html code:

  <html>
 <head>
 <script type="text/javascript" src="../include/ckeditor/ckeditor.js"></script>
 <script type="text/javascript" src="../include/ckeditor/sample.js" ></script>
 </head>

 <body>
 <form>
 <fieldset>
 <label for="name">Name</label>
 <div id="resp" ></div>
 </fieldset>
 </form>
 </body>
 </html>

Please help me for resolve problem.

  • javascript
  • php
  • jquery
  • html
  • ajax
Share Improve this question asked May 20, 2014 at 10:33 user3656165user3656165 391 silver badge2 bronze badges 5
  • Does it throw any errors? What happens? – Viktor Svensson Commented May 20, 2014 at 10:38
  • no, display only textarea without eceditor toolbars. – user3656165 Commented May 20, 2014 at 10:41
  • Paste the code that converts your textareas to eceditor textareas. – Viktor Svensson Commented May 20, 2014 at 10:52
  • ckeditor.replace('fname'); and $("#fname").ckeditor(); both doesn't work. – user3656165 Commented May 20, 2014 at 10:58
  • try this ckeditor./forums/CKEditor-3.x/… – Muddasir Abbas Commented Sep 4, 2015 at 9:36
Add a ment  | 

5 Answers 5

Reset to default 2

Insert these lines:

ckeditor.replace('#fname'); // ADD THIS
$('#fname').ckeditor(); // ADD THIS

Your code should look like this:

jQuery.ajax({
type: "POST",
url: "reg_arz_ajax2.php",
data: "book="+book_arzyabi,
dataType : "html",
success: function(response){

    $('#resp').html(response);
    ckeditor.replace('#fname'); // ADD THIS
    $('#fname').ckeditor(); // ADD THIS
},
error:function (xhr, ajaxOptions, thrownError){
    //On error, we alert user
    alert(thrownError);
}
});

$( "#dialog-form" ).dialog( "open");

});

for me having only this line worked: 

ckeditor.replace('#fname');

and the following line needs to be REMOVED: 

$('#fname').ckeditor(); // this does NOT work

also note, that ckeditor needs to be in caps, so:

CKEDITOR.replace('#fname');

Add only CKEDITOR.replace('fname'); instead. The # is not necessary. Also, you do not have to add: 

$('#fname').ckeditor();

Make sure it's uppercase throughout, eg CKEDITOR not ckeditor

don't add ckeditor.replace('#fname'); you have to add $('#fname').ckeditor(); and in my project is works

Edit this lines:

CKEDITOR.replace( 'fname' );

Your code should look like this:

jQuery.ajax({
type: "POST",
url: "reg_arz_ajax2.php",
data: "book="+book_arzyabi,
dataType : "html",
success: function(response){

    $('#resp').html(response);
    CKEDITOR.replace( 'fname' ); //this line should be changed like this
    $('#fname').ckeditor();
},
error:function (xhr, ajaxOptions, thrownError){
    //On error, we alert user
    alert(thrownError);
}
});

$( "#dialog-form" ).dialog( "open");

});

本文标签： javascriptckeditor not loading on element generated via ajax callStack Overflow

版权声明：本文标题：javascript - ckeditor not loading on element generated via ajax call? - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1742370903a2462213.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。