Opened 8 years ago

Closed 8 years ago

#7888 closed bug (notabug)

CKEditor loading in Colorbox not working [ Google Chrome ]

Reported by: hadinishad Owned by:
Priority: minor Milestone: 1.9.0
Component: ui.core Version: 1.5.1
Keywords: Cc:
Blocked by: Blocking:

Description

I am using Colorbox in my project. I have integrated CKEditor in colorbox. Its working fine in all browsers, but a small issue in Google Chrome - Editor will open properly on first click, After closing the pop up and try the editor on second time without loading the page , I can't type text in the editor, Editor will enable on clicking on the source. I am not using the source toolbar in basic editor.

I spent more than 5 days for for finding a solution for this issue and try help from others - No result yet. Expecting better feedback...

Thanks for help in advance.

I have set up a test code for this...

index1.html

<!DOCTYPE html PUBLIC "-W3CDTD XHTML 1.0 TransitionalEN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

<head>

<script type="text/javascript" src="../ckeditor/_samples/jquery-1.5.1.min.js"></script> <script src="colorbox/jquery.colorbox-min.js"></script> <script type="text/javascript" src="../ckeditor/ckeditor.js"></script> <script type="text/javascript" src="../ckeditor/adapters/jquery.js"></script> <script src="../ckeditor/_samples/sample.js" type="text/javascript"></script>

<link rel="stylesheet" href="colorbox.css" /> <link href="../ckeditor/_samples/sample.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">

jQuery(document).ready(function () {

jQuery('a.gallery').colorbox({ opacity:0.5 });

});

</script>

<style type="text/css">

</style>

</head> <body>

<a class='gallery' href='index2.html' style="font-size: 30px;">click here for editor</a>

</body>

</html>

index2.html

<textarea name="ckeditor_replace" id="ckeditor_replace" class="ckeditor_replace"></textarea> <script type="text/javascript">

$(document).ready( function() { I use jquery

var instance = CKEDITOR.instancesckeditor_replace?; if(instance) {

CKEDITOR.remove(instance);

} CKEDITOR.config.startupFocus = true; CKEDITOR.config.startupShowBorders = false; CKEDITOR.config.startupOutlineBlocks = true; CKEDITOR.config.startupMode = 'source'; $( '.ckeditor_replace' ).val('12345'); $( '.ckeditor_replace' ).ckeditor(function() { } );

});

</script>

Regards

Nishad Aliyar

Change History (2)

comment:1 Changed 8 years ago by hadinishad

Hi All,

I got the solution for the same , just include the jquery and jquery adapter in index2.html ( first 2 lines ).

<script type="text/javascript" src="../ckeditor/_samples/jquery-1.5.1.min.js"></script> <script type="text/javascript" src="../ckeditor/adapters/jquery.js"></script>

<textarea name="ckeditor_replace" id="ckeditor_replace" class="ckeditor_replace"></textarea> <script type="text/javascript">

$(document).ready( function() { I use jquery

var instance = CKEDITOR.instancesckeditor_replace?; if(instance) {

CKEDITOR.remove(instance);

} CKEDITOR.config.startupFocus = true; CKEDITOR.config.startupShowBorders = false; CKEDITOR.config.startupOutlineBlocks = true; CKEDITOR.config.startupMode = 'source'; $( '.ckeditor_replace' ).val('12345'); $( '.ckeditor_replace' ).ckeditor(function() { } );

});

</script>

Regards

Nishad Aliyar

Last edited 8 years ago by hadinishad (previous) (diff)

comment:2 Changed 8 years ago by Scott González

Resolution: invalid
Status: newclosed

This has nothing to do with jQuery UI. In the future, please read the big red box that says not to paste large blocks of code in the ticket.

Note: See TracTickets for help on using tickets.