Вопрос отправки формы jQuery

Question

У меня есть форма, которую я пытаюсь отправить внутри fancybox (www.fancybox.net).Если я перейду прямо к форме, то отправлю штраф.Однако, если я загружу форму внутри страницы, которую я хочу вызвать, fancybox из формы не отправит, и fancybox уйдет, и страница обновится.Я пробовал fancybox и facebox к одной и той же проблеме. Ниже приведен код Jquery, который у меня есть на главной странице.Эта страница открывает fancybox и, как следствие, форму для отправки.Форма должна показывать сообщение с благодарностью в окне при отправке вместо обновления страницы. Любая помощь очень ценится:

JavaScript:

$(document).ready(function () {

    $("#various1").fancybox({
        'opacity': true,
        'overlayShow': false,
        'transitionIn': 'none',
        'autoscale': 'false',
        'transitionOut': 'none'
    });

    $("submit").submit(function () {
        alert('it submits');

        // we want to store the values from the form input box, then send via ajax below
        var name = $('#name').attr('value');
        var email = $('#email').attr('value');
        var password = $('#password').attr('value');
        var custom1 = $('#custom1').attr('value');
        var custom2 = $('#custom2').attr('value');
        var custom3 = $('#custom3').attr('value');
        var custom4 = $('#custom4').attr('value');
        var custom5 = $('#custom5').attr('value');
        var custom6 = $('#custom6').attr('value');
        var custom7 = $('#custom7').attr('value');
        var custom8 = $('#custom8').attr('value');
        var custom9 = $('#custom9').attr('value');
        var custom10 = $('#custom10').attr('value');
        $.ajax({
            type: "POST",
            url: "test.php",
            data: "name=" + name + "& email=" + email + "& password=" + password + "& custom1=" + custom1 + "& custom2=" + custom2 + "& custom3=" + custom3 + "& custom4=" + custom4 + "& custom5=" + custom5 + "& custom6=" + custom6 + "& custom7=" + custom7 + "& custom8=" + custom8 + "& custom9=" + custom9 + "& custom10=" + custom10,

            success: function () {

                $('submit').fadeOut(function () {
                    $('div.success').fadeIn();
                });
            }
        });
        return false;
    })

;});

Ссылка на форму:

<a id="various1" href="register.php">

Answer 1

data: "name=" + name + "& email=" + email + "& password=" + password + "& custom1=" + custom1 + "& custom2=" + custom2 + "& custom3=" + custom3 + "& custom4=" + custom4 + "& custom5=" + custom5 + "& custom6=" + custom6 + "& custom7=" + custom7 + "& custom8=" + custom8 + "& custom9=" + custom9 + "& custom10=" + custom10,

Это так неправильно, неправильно и безобразно. После & не должно быть пробелов. На самом деле прохождение строки там уже плохо. Передайте объект как это:

var data = { name: name, email: email, password: password, custom1: custom1, ... };

с использованием data: data

Вот исправленная версия:

$(document).ready(function () {

    $("#various1").fancybox({
        'opacity': true,
        'overlayShow': false,
        'transitionIn': 'none',
        'autoscale': 'false',
        'transitionOut': 'none'
    });

    $("form").submit(function () {
        var data = {
            name: $('#name').val(),
            email: $('#email').val(),
            password: $('#password').val(),
            custom1: $('#custom1').val(),
            custom2: $('#custom2').val(),
            custom3: $('#custom3').val(),
            custom4: $('#custom4').val(),
            custom5: $('#custom5').val(),
            custom6: $('#custom6').val(),
            custom7: $('#custom7').val(),
            custom8: $('#custom8').val(),
            custom9: $('#custom9').val(),
            custom10: $('#custom10').val()
        };

        $.ajax({
            type: "POST",
            url: "test.php",
            data: data,
            success: function() {
                $('submit').fadeOut(function () {
                    $('div.success').fadeIn();
                });
            }
        });
        return false;
    })

Вы действительно должны использовать плагин формы jquery , чтобы отправить эту форму, хотя ... Экономит вам много времени, набирая все имена полей ...