Расширенная проверка формы jQuery - как изменить GET на POST? - PullRequest
2 голосов
/ 29 июля 2011

Я довольно новичок в jQuery и JavaScript, и я пытался реализовать контактную форму jQuery, которая вызывает файл PHP для отправки фактического электронного письма.

Вот часть jQuery, которая вызываетPHP-файл после прохождения проверки jQuery:

$(this).click(function() { 

    var result = $.formValidator(options);

    if (result && jQuery.isFunction(options.onSuccess)) {
        options.onSuccess();

        // Start Processor
        if($(this).data('formstatus') !== 'submitting'){

            // Setup variables
                // Form Variables
                    var name = $(".form input#getstarted-name").val();
                    var number = $(".form input#getstarted-phone1").val() + ' ' + $(".form input#getstarted-phone2").val();
                    var company = $(".form input#getstarted-company").val();
                    var email = $(".form input#getstarted-email").val();
                    var message = $(".form textarea#getstarted-message").val();
                    var from_url = $(".form input#getstarted-from_url").val();

                // Consolidate Variables
                var dataString = 'name=' + name + '&number=' + number + '&company=' + company + '&email=' + email + 
                             '&message=' + message + '&from_url=' + from_url;
            var form = $(this),
                //formData = email.serialize(),
                formData = dataString, 
                formUrl = form.attr('action'),
                formMethod = form.attr('method'), 
                responseMsg = $('#startproject-response');

            //add status data to form
            form.data('formstatus','submitting');

            //show response message - waiting
            responseMsg.hide()
                       .removeClass('response-error')
                       .removeClass('response-success')
                       .addClass('response-waiting')
                       .text('Please Wait...')
                       .fadeIn(200);

            $.ajax({
                url: "/layout/js/jquery/forms/form_db_process.php",
                type: formMethod,
                data: formData,
                success:function(data){

                    //setup variables
                    var responseData = jQuery.parseJSON(data), 
                        klass = '';

                    //response conditional
                    switch(responseData.status){
                        case 'error':
                            klass = 'response-error';
                        break;
                        case 'success':
                            klass = 'response-success';
                        break;  
                    }

                    //show reponse message
                    responseMsg.fadeOut(200,function(){
                        $(this).removeClass('response-waiting')
                               .removeClass('response-error')
                               .addClass(klass)
                               .text(responseData.message)
                               .fadeIn(200,function(){
                                   //set timeout to hide response message
                                   setTimeout(function(){
                                       responseMsg.fadeOut(200,function(){
                                           $(this).removeClass(klass);
                                           form.data('formstatus','idle');
                                       });
                                   },3000)
                                });
                    });
                }
            });
        }

        //prevent form from submitting
        return false;

        // End Processor

    }
});

А вот PHP-файл "form_db_process.php":

$name = mysql_real_escape_string($_GET['name']);
$number = mysql_real_escape_string($_GET['number']);
$company = mysql_real_escape_string($_GET['company']);
$email = mysql_real_escape_string($_GET['email']);
$message = mysql_real_escape_string($_GET['message']);
$ip = $_SERVER['REMOTE_ADDR'];
$timestamp = date("y/m/d : H:i:s", time());
$from_url = mysql_real_escape_string($_GET['from_url']);

// send email etc...

У меня все это работает, но ябыло интересно, как изменить GET вместо POST?Я знаю, как сделать это с обычным HTML + PHP, но jQuery я в растерянности ...

Я посмотрел здесь: http://api.jquery.com/jQuery.post/

Но не смог ничего придуматьработоспособный / не был уверен, как его использовать.Любая помощь будет оценена !!

// РЕДАКТИРОВАТЬ: я добавил HTML-часть ниже (для формы):

<form id="startproject-form" class="form" method="post" action="">

<!-- ... form inputs here ... -->

</form>

Ответы [ 3 ]

3 голосов
/ 29 июля 2011

в jQuery:

$.ajax({
  type: 'POST',

Ваш код делает:

 $.ajax({
                url: "/layout/js/jquery/forms/form_db_process.php",
                type: formMethod,

И formMethod установлен ранее:

var form = $(this),
                //formData = email.serialize(),
                formData = dataString, 
                formUrl = form.attr('action'),
                formMethod = form.attr('method'), 

Либо переопределите его, либо фактически изменитеMETHOD атрибут вашей формы для POST.

1 голос
/ 29 июля 2011

$.ajax может выполнять как GET, так и POST. Это передаваемый вами тип формы, который извлекается из атрибута method формы, так что вы можете просто изменить его.

Вы также можете использовать сокращения $.get или $.post, которые вызывают $.ajax за экранами.

0 голосов
/ 29 июля 2011

Сначала убедитесь, что formMethod имеет значение «POST», и я передаю данные в формате json, а не в строке запроса. В этом случае вам необходимо указать datatype и contentType соответственно.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...