jQuery ajax request doesnt fire and freezes page

Question

I have a major problem with a jquery ajax request. Tt seems to freeze the current page.
I have tried using *$.pos*t as well but it does the same thing. I have looked around but can't seem to find a definitive answer as to why this occurs.

Code:

var sd = $('#start-date'),
    ed = $('#end-date'),
    n = $('#name'),
    o = [],
    m = $('#multi').prop('checked');

if ($.trim(n.val()) !== '') {
    $('.option').each(function () {
        var el = $(this);
        if ($.trim(el.val()) !== '') {
            o.push(el.val())
        }
    });

    if (o.length > 1) {
        alert(1);
        $.ajax({
            url: "pageurl",
            type: "POST",
            data: {
                name: n,
                options: o,
                multiple: m,
                start: sd,
                end: ed
            },
            dataType: "json",
            success: function (data) {
                if (data.success !== undefined) {
                    if (data.success == '1') {
                        alert('worked');
                    } else {
                        displayWarning(data.reason);
                    }

                } else {
                    displayWarning('We couldn\'t process your request at this time. Please try again later');
                }
            },
            error: function () {
                displayWarning('We couldn\'t process your request at this time. Please try again later');

            }
        });
    } else {
        displayWarning('please enter at least 2 options');
    }

} else {
    displayWarning('Please provide a name for the poll');
}

Any help would be greatly appreciated

Thank You

Answer 1

The json is invalid should look like this:

var sd = $('#start-date').val(),
ed = $('#end-date').val(),
n = $('#name').val(),
o = [],
m = $('#multi').prop('checked');

data: {
    "name": n,
    "options": o,
    "multiple": m,
    "start": sd,
    "end": ed
}