jQuery .serializeObject is not a function - only in Firefox

Question

I'm using jQuery, and specifically this function

$("#postStatus").serializeObject();

It works absolutely fine in Chrome and Safari, but when I do it in Firefox it doesn't work. I used Firebug to see what error it was giving, and i'm getting this

$("#postStatus").serializeObject is not a function

Why doesn't this function work in Firefox?

UPDATE...

Oh yes, I completely forgot that it's not a core function. I remember that I searched a way to serialize a form and found this solution;

$.fn.serializeObject = function()
{
   var o = {};
   var a = this.serializeArray();
   $.each(a, function() {
       if (o[this.name]) {
           if (!o[this.name].push) {
               o[this.name] = [o[this.name]];
           }
           o[this.name].push(this.value || '');
       } else {
           o[this.name] = this.value || '';
       }
   });
   return o;
};

I've managed to fix this issue by placing the function above at the top of the JS file. Thanks for your help guys.

Sorry do you mean if I'm loading jQuery before this script? If that's what you mean then yes I am. Other Jquery works fine, just the serializeObject function. — Wasim, Jan 17 '12 at 19:46
jquery has no function as `serializeObject` in the core AFAIK — Rafay, Jan 17 '12 at 19:46
@3nigma: It a plugin; I was going to make the same comment until I googled it. — CBusBus, Jan 17 '12 at 19:49
@SOliver yup i know that too(after googling of course) but the OP should have included it in the question description... — Rafay, Jan 17 '12 at 19:51
Hye , Wasim i need your help in this project kindly contact me plz...! faisalworkingid@gmail.com , i am also following 308Tube tutorial — mfaisalhyder, Dec 18 '14 at 19:14

Rafay · Accepted Answer · 2012-01-17T20:54:47.490

9

AFAIK jQuery has no function defined as serializeObject in its core. Probably you are using a plugin, and that its problematic in Firefox only so its safe to assume that your script inclusion is in proper order, try wrapping up your code in the ready handler

$(function(e){
$("#postStatus").serializeObject();
});

or you can place the javascript at the bottom of the page.

DEMO

edited Jan 17 '12 at 20:54

answered Jan 17 '12 at 19:49

Rafay

30,950
5
68
101

Yes I completely forgot that it wasn't a core function, please read my edit above. – Wasim Jan 17 '12 at 20:33
Yes it works great thanks. I just placed the `serializeObject` function at the top of the JS file. – Wasim Jan 17 '12 at 20:53

score 1 · Answer 2 · answered Aug 03 '15 at 13:21

You might also want to check this out https://github.com/citnvillareal/serializeObject.

Sample Usage

<form>
    <input type="text" name="txt01[][name]" value="Text 01" />
    <input type="text" name="txt01[][phone]" value="000001" />

    <input type="text" name="txt01[][name]" value="Text 02" />
    <input type="text" name="txt01[][phone]" value="000002" />

    <input type="submit" value="Submit" />
</form>

<script>
    ( function( $){
        $( document ).ready( function(){
            $( "form" ).submit( function( e ) {
                e.preventDefault();

                var jsonObject = $( this ).serializeObject();
                console.log( jsonObject );
            } );
        } );
    } )( jQuery );
</script>

Console Output

Object 
{
    txt01: Array(2) 
    {
        0: Object
        {
            name: Text 01
            phone: 000001
        },

        1: Object
        {
            name: Text 02
            phone: 000002
        }
    }
}

For more details click here.

score 1 · Answer 3 · answered Feb 06 '18 at 08:44

1

Try serialize() or serializeArray() instead serializeObject()

answered Feb 06 '18 at 08:44

Ba.Lal

180
2
16

jQuery .serializeObject is not a function - only in Firefox

3 Answers3

Linked