jQuery serialize() leaves out textarea

Question

When I submit a form using jQuery's serialize() method, everything gets submitted except the textarea in the form. Is this a common issue? I can't figure it out. The form works except for just the textarea which stays undefined???

<textarea form="new_note_form" id="note_text" name="note_text" required="required"></textarea>     

Answer 1

It does not work until you add name attribute to the textarea.

<textarea id="sLifeStyle3Content" name="sLifeStyle3Content" placeholder="HTML is allowed">   <apex:outputText value="{!sLifeStyle3Content}" /> </textarea> 

Answer 2

No it doesn't.

It works fine. http://jsfiddle.net/nuBkM/

<form>     <input name="foo" value="bar"/><br>     <textarea name="something">lorem ipsum</textarea> </form> 

The JavaScript

console.log($("form").serialize()); // => foo=bar&something=lorem+ipsum  

---

.serializeArray works too

console.log($("form").serializeArray()); // => [{name: "foo", value: "bar"}, {name: "something", value: "lorem ipsum"}]  

Answer 3

Another work around for this is to turn the textarea value into a variable and pass that with the ajax call...

var comment = $('.note_comment').val();

           $.ajax({
               type: "POST",
               url: '/approot/rewrite.cfm/app.people/insertNote?format=json&Comment=' + comment,
               data: $("form[name='add_note_form']").serializeArray(),
               success: function(data)
               {
              alert('success');         
               }
             });

Answer 4

If the textarea is controlled by an editor like tinyMCE, you may need to call tinyMCE.triggerSave(), as described in this answer.