Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Not displaying any text wrapped in <ul> element #4571

Open
mikedino opened this issue Jan 17, 2025 · 3 comments
Open

Not displaying any text wrapped in <ul> element #4571

mikedino opened this issue Jan 17, 2025 · 3 comments

Comments

@mikedino
Copy link

Implementing on an existing application with old entries, we have many with <ul> elements. These entries are not displaying in the editor.

HTML: Testing text before tag\n<ul>\n<li>Here is older entry\n<li>Bullet 2\n<li>Bullet 3\n</ul>

Rendered:
Image

Edit Form:
Image

If I manually change the HTML and replace <ul> with <ol>, the edit form will show the text

HTML (mod): Testing text before tag\n<ol>\n<li>Here is older entry\n<li>Bullet 2\n<li>Bullet 3\n</ol>

Edit Form (mod):
Image

@Juicetan
Copy link

V2 now uses ordered lists for all list types (https://quilljs.com/docs/upgrading-to-2-0#parchment). If you want an ordered list ensure the list items have the attribute data-list="ordered" and for unordered lists, ensure list items have the attribute data-list="bullet". For example:

<!-- ordered list -->
<ol>
  <li data-list="ordered">1</li>
  <li data-list="ordered">2</li>
  <li data-list="ordered">3</li>
</ol>
<!-- unordered list -->
<ol>
  <li data-list="bullet">a</li>
  <li data-list="bullet">b</li>
  <li data-list="bullet">c</li>
</ol>

@mikedino
Copy link
Author

I understand that. I'm asking why this doesn't allow for backfitting existing solutions. I have tables with thousands and thousands of records. You're saying I have to go carefully modify the html in every record? That's not a viable solution.

@Juicetan
Copy link

Juicetan commented Jan 17, 2025

Ah so if you feed your HTML using the clipboard convert function it should transform your semantic HTML (<ul>,<ol>) into quill's <ol> lists. For example:

this.quill.setContents(this.quill.clipboard.convert({
  html: htmlStr
}), 'silent')

and to get it out to your own semantic HTML

this.quill.getSemanticHTML()

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants