Progress® Kendo UI® for jQuery Feedback Portal
Back to Feed
Request a Feature Report a Bug
Completed
Last Updated: 09 May 2022 16:02 by ADMIN
Release 2022.R2
Angel
Created on: 04 Mar 2021 13:06
Category: Kendo UI for jQuery
Type: Bug Report
0
jQuery Editor wrapping new paragraphs in span tags

Hi guys,

I'm using the following dojo: https://dojo.telerik.com/UXUSUvEC

Here are the steps to reproduce:

1. Add the following to the HTML view of the editor: <span>Testing</span>
2. Switch back to the WYSIWYG mode
3. Hit enter twice to add two new line
4. Enter some text (e.g. "Text from WYSIWYG view")
5. Hit enter to add a new line
6. Switch back to HTML view
7. Notice how it keeps replicating the spans

HTML view will show the following

<p><span>Test</span></p>
<p><span>&nbsp;</span></p>
<p><span>Test from WYSIWYG view</span></p>
<p><span>&nbsp;</span></p>

I've discussed this with Yanko Dzhemerenov before submitting.

2 comments
ADMIN
Ianko
Posted on: 10 Mar 2021 07:45

Hello Angel,

The last two reports are actually expected behaviour. Updating the HTML via the viewHtml dialog will always put the selection at the beginning of the content. Thus, pressing enter will move the current selection to a new paragraph and add a new one before the selection. 

Note that the viewHtml is a tool to edit the entire HTML. It is not expected to modify the selected based on separate elements inserted via this tool. 

Regards,
Ianko
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Angel
Posted on: 05 Mar 2021 07:52

Hi all,

Another observation by the client whose case I'm working on. Same thing would happen if you add a button element as well, though the behavior has 2 scenarios:

I. Add standalone button tag:

  • open the dojo https://dojo.telerik.com/UXUSUvEC
  • click View HTML tool
  • add the following: "<button type="button">Click Me!</button>"
  • click Update
  • try entering a new line break by pressing Enter

Actual: cursor remains at the end of the button's line

Expected: cursor to move to a new paragraph

II. Add button tag inside a p tag:

  • open dojo
  • input some text and press enter
  • click View HTML
  • in the empty p element replace the non-breaking space with the following: "<button type="button">Click Me!</button>"
  • click Update
  • in the wisywyg editor press Enter

Actual: new p element is inserted with a nested button element

Expected: new empty p element

The workaround I'm providing the customer is to wrap the button in its own p tag and then manually add another empty p tag after that

Create an account Log In
View
Type
Status
Category