Opened 10 years ago
Last modified 10 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 10 years ago by
comment:2 Changed 10 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.
idalready exists in the DOM and ckeditor generete a new element with the sameid.idduplicated in the DOM, but ckeditor shared space will create "top toolbar", "button toolbar" and div container of editable area with the sameid