#13 ✓invalid
Anthony Hildoer

Form.serialize() not handling textareas

Reported by Anthony Hildoer | April 15th, 2008 @ 06:56 AM

There seems to be a problem serializing forms with text areas, such as when submitting an AJAX request. Only data that was in the innerhtml of the textarea during page load is serialized. So, any data that was added, or that was modified in the textarea by the user does not show up in the serialization. I have modified a copy of prototype and it seems to work now. But, I am pretty sure there is a more elegant solution than mine. I have attached my modification so you can diff it and see the change.

Also, this problem occurs in both firefox 2.0 and IE7.

To recreate the problem, create an html form. include this tag:

Have the form serialize on submit then echo or alert the serialized string. Make sure to enter some data before submitting the form. you will see that the serialized string only contains "data=" and not "data=[SOME DATA YOU ENTERED]".

Comments and changes to this ticket

  • Juriy Zaytsev

    Juriy Zaytsev April 15th, 2008 @ 06:15 PM

    I can't reproduce this issue. Form element is serialized according to what it's "value" property contains.

    Could you give an example of a simple failing case?


  • Anthony Hildoer

    Anthony Hildoer April 15th, 2008 @ 08:54 PM

    Your right, serialization for textareas works fine. It turns out the problem I was experiencing was due to a workaround for another problem with serialization.

    Prototype does not handle multiple submit buttons of the same name, IE. serializing only the clicked submit button. So, if a form has a "Save" and "Edit" button, prototype serialization will serialize both submits resulting in two values in the serialization both with the same index, but different values.

    I suppose this ticket should be closed and another should be opened for the multiple submit serialization.

  • Tobie Langel

    Tobie Langel April 15th, 2008 @ 09:03 PM

    • State changed from “new” to “invalid”

    Afaik, there's an option to select which input type=button you want to select.

    I think the syntax is:

    $(form).serialize({ submit: 'Save' });

  • Anthony Hildoer

    Anthony Hildoer April 15th, 2008 @ 09:14 PM

    Tobie, Thanks for the tip. But, I don't think that solution will work for me. I am not a javascript expert, but it would seem that would require a unique function call for every form. With that I would have to build a hash of all elements in the form dynamically, skipping the none-active submit buttons. If I am going to do all that, I might as well just serialize the data myself instead of calling Form.serialize.

    If the serialize function simply skips submit objects when they equal event.explicitOriginalTarget for mozilla browsers or document.activeElement for IE, then it would not require building a hash dynamically.

  • Tobie Langel

    Tobie Langel April 15th, 2008 @ 09:30 PM

    Anthony, I think you're missing the point. See this: http://pastie.caboo.se/181261

  • Anthony Hildoer

    Anthony Hildoer April 15th, 2008 @ 09:49 PM

    My problem is the opposite of that, multiple submits, all with the same name, but different values.

    My form looks like this:

    My framework allows an arbitrary number of types of forms, I don't want to craft a special serialization call depending on what input names appear within a form. For example, if I create a new form which has an 'Edit' button, I don't want to have to write a special call to serialize in order to handle the form.

    The idea is to generalize Ajax forms processing so that a single Ajax interface is used for all possible forms.

  • Anthony Hildoer

    Anthony Hildoer April 15th, 2008 @ 09:52 PM

    I had some HTML in that last post, looks like it got stripped out. Not sure how to post it here.

  • Anthony Hildoer

    Anthony Hildoer April 15th, 2008 @ 09:58 PM

    I just posted the code in an html file on my server: http://www.hildoer.com/formProbl...

  • Tobie Langel

    Tobie Langel April 15th, 2008 @ 11:24 PM

    OK, understood your issue now.

    Please feel free to open a ticket with that issue.



  • Tobie Langel

    Tobie Langel July 24th, 2009 @ 02:01 AM

    • Tag set to dom, section:dom

    [not-tagged:"form" tagged:"section:dom" bulk edit command]

  • Tobie Langel

    Tobie Langel July 24th, 2009 @ 02:10 AM

    • Tag changed from dom, section:dom to section:dom

    [not-tagged:"dom" bulk edit command]

  • jeux4banat

    jeux4banat March 17th, 2016 @ 08:08 PM

    • Importance changed from “” to “”

    http://jeux4banat.blogspot.com يقدم العاب طبخ جديدة وممتعة مجانا

  • jeux4banat

    jeux4banat March 17th, 2016 @ 08:09 PM

    أكبر موقع عربي يضع كمية هائلة من العاب الطبخ http://www.jeux4banat.blogspot.com

  • krkrgames

Please Sign in or create a free account to add a new ticket.

With your very own profile, you can contribute to projects, track your activity, watch tickets, receive and update tickets through your email and much more.

New-ticket Create new ticket

Create your profile

Help contribute to this project by taking a few moments to create your personal profile. Create your profile ยป

The Prototype JavaScript library.

Shared Ticket Bins