jQuery - How to dynamically assign form object

Question

I'm trying to have a single function for submitting forms on various modals on my site. The problem I am having is when trying to serialize the form I get the error 'form.serialize() is not a function". I believe I've narrowed it down to how I am assigning the form variable.

The Submit Button:

<button id="modalSave" class="btn btn-primary" data-url="/Donors/save" data-form="#DonorAddForm" type="button">Submit</button>

The Submit Function:

$(".container").on("click", "#modalSave", function() {
    var form = $(this).data('form');

    $.ajax({
        url: $(this).data('url')
        dataType: "html",
        data: form.serialize(),
        beforeSend: function() {
            $("#loading").fadeIn();
        },
        success: function(data, textStatus) {
            $("#modalStatus").html(data);
        },
        complete: function() {
            $("#loading").fadeOut();
        }
    });
});

If I change the line:

var form = $(this).data('form');

to:

var form = $('#DonorAddForm');

then the 'form' variable is assigned the form object, otherwise it is simply assigned as a string.

How can I assign the object to the 'form' variable instead of a string?

zeantsoi · Accepted Answer · 2013-11-16 23:44:15Z

1

$(this).data('form') doesn't return a DOM element - it returns the value of the data-form attribute, which in this case is the string #DonorAddForm. To retrieve the respective DOM element, use jQuery to grab the element by id:

var formData = $(this).data('form'); // "#DonorAddForm"
var form = $(formData); // DOM element with id="#DonorAddForm"

edited Nov 16, 2013 at 23:44

answered Nov 16, 2013 at 23:33

zeantsoi

26.3k7 gold badges71 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jQuery - How to dynamically assign form object

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related