How to transfer content from a contenteditable div to a textarea or input?

Question

I’m having a problem trying to transfer content from a DIV editable for a textarea with Jquery.

The code I’m using is this one:

function setData(id) {
    id.className = "input editavel esse";
    var valor = $(".esse").text()
    $(".esse").next("td").children("textarea").text("\""+valor + "\"")
    $(".esse").removeClass("esse")
}

This function is called in onchange of div works perfectly when I change the contents of the div when typing, but when the content comes dynamically from the database (HTML Table) the function replaces the textarea by the content instead of putting the same inside it.

Answer 1

The .text("\""+valor + "\"") is usually used to manipulate the DOM and not the value of the field (I don’t know the core of jQuery deeply), also did not understand the quotes here "\""+valor + "\"".

To summarize, if you’re picking up the text using $(".esse").text(), you will not catch richtext, will only pick up plain text.

Use .val, then try to use this way:

 function setData(id) {
        id.className = "input editavel esse";
        var valor = $(".esse").text()
        $(".esse").next("td").children("textarea").val(valor)
        $(".esse").removeClass("esse")
    }

Note that when using .esse, will take all elements with this class, I believe that the correct thing would be to take the id (I believe this id is an html/dom element), if this setData(id) for a string or int, this is wrong:

id.className = "input editavel esse";