toHtml automated closing tags?

33 views
Skip to first unread message

francescoBB

unread,
Feb 4, 2012, 10:37:15 PM2/4/12
to rangy
Using the toHtml method I noticed that if you select in the middle
some text with bold text (i.e <b></b> or any other tags) the selection
automatically adds that bold tag <b> or </b> in case your selection
happens in the middle of a bold word.

for instance if i have <b> New york </b> and I select only "york </b>
" the selection automatically become "<b>york </b> "

I wonder if this due to Rangy or the browser, and in case how can
disable this automated correction

Tim Down

unread,
Feb 5, 2012, 11:41:50 AM2/5/12
to ra...@googlegroups.com
Hi,

Rangy (actually the browser) will always return valid HTML, meaning
all tags in the output will having matching start/end tags. This is
because toHtml() copies the portion of the document that the
range/selection selects into a separate element and returns the
element's innerHTML property. This means that if the selection/range
crosses a node boundary, the HTML returned will include copies of both
nodes. If you just selected "yor" then toHtml() will not include <b>
and </b> tags.

Tim

francescoBB

unread,
Feb 6, 2012, 12:40:49 PM2/6/12
to rangy
thanks, so my question is: is it possible to diable it? do you have
suggestion where edit the code to keep the selection AS IS?
I need it because in my project I need to select EXACTLY AND ONLY the
html string, what is selected, not what is human friendly for the user

thanks

On Feb 5, 11:41 am, Tim Down <t...@timdown.co.uk> wrote:
> Hi,
>
> Rangy (actually the browser) will always return valid HTML, meaning
> all tags in the output will having matching start/end tags. This is
> because toHtml() copies the portion of the document that the
> range/selection selects into a separate element and returns the
> element's innerHTML property. This means that if the selection/range
> crosses a node boundary, the HTML returned will include copies of both
> nodes. If you just selected "yor" then toHtml() will not include <b>
> and </b> tags.
>
> Tim
>

francescoBB

unread,
Feb 6, 2012, 2:54:31 PM2/6/12
to rangy
actually my example should be

<b>New York</b> is a great city.

than I select

York</b> is a great

or

ork</b> is a great

I'd like to be able to get only that portion, but you are saying that
the browser naturally add the matching tag?

Is it Rangy or the browser? there fore: is it possible or not to het
the exact string "as is"

thanks

F.


On Feb 5, 11:41 am, Tim Down <t...@timdown.co.uk> wrote:
> Hi,
>
> Rangy (actually the browser) will always return valid HTML, meaning
> all tags in the output will having matching start/end tags. This is
> because toHtml() copies the portion of the document that the
> range/selection selects into a separate element and returns the
> element's innerHTML property. This means that if the selection/range
> crosses a node boundary, the HTML returned will include copies of both
> nodes. If you just selected "yor" then toHtml() will not include <b>
> and </b> tags.
>
> Tim
>

francescoBB

unread,
Feb 6, 2012, 2:58:07 PM2/6/12
to rangy
moreover:

in case it wouldn't be possible to achieve what I'm saying because of
a browser setting... there is any other feedback from the browser so I
can
know that particular string has been "repaired" so i can remove the
first tag on my code?


On Feb 5, 11:41 am, Tim Down <t...@timdown.co.uk> wrote:
> Hi,
>
> Rangy (actually the browser) will always return valid HTML, meaning
> all tags in the output will having matching start/end tags. This is
> because toHtml() copies the portion of the document that the
> range/selection selects into a separate element and returns the
> element's innerHTML property. This means that if the selection/range
> crosses a node boundary, the HTML returned will include copies of both
> nodes. If you just selected "yor" then toHtml() will not include <b>
> and </b> tags.
>
> Tim
>

Morgan Tiley

unread,
Feb 7, 2012, 10:17:36 AM2/7/12
to ra...@googlegroups.com
Hey Francesco,
Just wanted to chime in - in most cases, code will require proper HTML nodes. This is why the browser will only return it and not simply the string you select. Otherwise it's returning broken HTML.
You could possibly hack away by using the offset properties of the range and if they're > 0 you'll know you have a partial tag selection.
But you may want to reconsider your application's requirements and work with the proper node tree instead.
--
Morgan

francescoBB

unread,
Feb 7, 2012, 10:55:02 PM2/7/12
to rangy
i tried the offset but it calculates the offset based on the parent
node so i cant get if the selection starts in between of a bold/italic/
span tag or not...

btu i was thinking..would possible then to automatically extend the
selection to the next or previous complete word so the user won't
select a partial/broken word?

may i should starta new thread...

On Feb 7, 10:17 am, Morgan Tiley <morgan.ti...@gmail.com> wrote:
> Hey Francesco,
> Just wanted to chime in - in most cases, code will require proper HTML
> nodes. This is why the browser will only return it and not simply the
> string you select. Otherwise it's returning broken HTML.
> You could possibly hack away by using the offset properties of the range
> and if they're > 0 you'll know you have a partial tag selection.
> But you may want to reconsider your application's requirements and work
> with the proper node tree instead.
>

ButterflyChristie

unread,
Jan 30, 2014, 7:07:36 PM1/30/14
to ra...@googlegroups.com
I know this is an old topic but I'm having this same problem, and the issue gets even worse when the selection has block elements.

For example if a message says:

<p>Text in a paragraph</p> <p>Text in a paragraph</p>

..and this selection is this:

a paragraph</p> <p>Text in 

..toHtml will have this:

<p>a paragraph</p> <p>Text in </p>

If someone wanted to wrap span tags around the selection for a message editor to change text color, the selected text will make new paragraphs when that's not what the user intended.

If anyone has any solutions that would be very helpful. Thank you!
Reply all
Reply to author
Forward
0 new messages