Opened 9 years ago
Last modified 9 years ago
#13967 confirmed Bug
sharedspace create div's with duplicated ids
Reported by: | Fabio C. Barrionuevo | Owned by: | |
---|---|---|---|
Priority: | Normal | Milestone: | |
Component: | General | Version: | 4.1 |
Keywords: | Cc: |
Description
Steps to reproduce
I suppose it's good practice not create duplicate ids in an html document, but ckeditor 4.5.5 + sharedspace is doing just that.
the following html demonstrate the error:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="top-ck-toolbar"> <!-- ckeditor top toolbar is rendered here --> </div> <div id="bottom-ck-toolbar" style="position: fixed;bottom: 0;width: 100%;"> <!-- ckeditor bottom toolbar is rendered here --> </div> <div id="content-ck"> <textarea id="mytextarea"></textarea> <!-- ckeditor editable area is rendered below --> </div> <script src="http://cdn.ckeditor.com/4.5.5/full-all/ckeditor.js"></script> <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script> <script> var ckeditor_config = { extraPlugins: [ "sharedspace", ].join(), sharedSpaces: { top: "top-ck-toolbar", bottom: "bottom-ck-toolbar" }, on: { // execute after ckeditor full load instanceReady: function (evt) { //by default, ckeditor create a div with the id is named "cke_" + ID_OF_TEXT_AREA var elements_with_same_id = $('[id="cke_mytextarea"]'); $(elements_with_same_id[0]).css({border: '3px solid rgb(183, 172, 19)' }); $(elements_with_same_id[1]).css({border: '3px solid rgb(43, 183, 19)' }); $(elements_with_same_id[2]).css({border: '3px solid rgb(183, 19, 19)' }); alert("number of duplicated elements with 'cke_mytextarea' id: "+ elements_with_same_id.length); } } }; //start ckeditor CKEDITOR.replace("mytextarea", ckeditor_config); </script> </body> </html>
Expected result
No generate duplicate ids.
I would suggest that ckeditor "top toolbar" and "button toolbar" should be id prefixed, respectively, "cke_toolbar_top" and "cke_toolbar_button".
Then, in case I have a textarea with id "mytextarea", the generated id to "top toolbar" and "button toolbar" is respectively, cke_toolbar_top_mytextarea" and "cke_toolbar_button_mytextarea".
Change History (2)
comment:1 Changed 9 years ago by
comment:2 Changed 9 years ago by
Status: | new → confirmed |
---|---|
Version: | 4.5.5 → 4.1 |
I was able to reproduce this problem from CKEditor 4.1 in every browser (tested also without jQuery).
this is related issue #10436, but my problem is different.
id
already exists in the DOM and ckeditor generete a new element with the sameid
.id
duplicated in the DOM, but ckeditor shared space will create "top toolbar", "button toolbar" and div container of editable area with the sameid