0

jqueryの検証後にフォームをphpに送信する方法を誰かが教えてください。

チュートリアル「Build a Neat HTML5 Powered Contact Form」を見つけました。フォームを作成して、ヘッドとボディを備えた 1 つの完全なページになるようにすると、検証されます。ただし、私のサイトは、ヘッダーとフッターがすべてのページで同じになるように設計されており、たとえば、中央に異なるコンテンツを含めています。

[http://mysite/index.php?page=contact]

これは JS スクリプトです。

`$(function(){
        $("#refreshimg").click(function(){
            $.post('newsession.php');
            $("#captchaimage").load('image_req.php');
            return false;
        });

        $("#contact_form").validate({
            rules: {
                    name: {
                    required: true,
                    minlength: 2
                  },
                  //telephone, email & message rules removed

                captcha: {
                    required: true,
                    remote: "process.php"
                }
            },
            //messages removed

            errorContainer: $('#errors'),
            errorLabelContainer: $('#errors ul'),
            wrapper: 'li',

            var dataString = 'name='+ name + '&email=' + email + '&telephone=' + telephone + '&message=' + message;
              //alert (dataString);return false;
              submitHandler: function(form) {
              $(form).ajaxSubmit({
                type: "POST",
                url: "pages/processC.php",
                data: dataString,
                success: function() {
                  $('#contactForm').html("<div id='message'></div>");
                  $('#message').html("<h2>Contact Form Submitted!</h2>")
                  .append("<p>We will be in touch soon.</p>")
                  .hide()
                  .fadeIn(1500, function() {
                    $('#message').append("<img id='checkmark' src='images/check.png' />");
                  });
                }
              });
              }
            return false;

            onkeyup: false
        }); `

The tutorial I followed came with the following submitHandler:

` /*submitHandler: function() {
            alert("Correct captcha!");
        },
        success: function(label) {
            label.addClass("valid").text("Valid captcha!")
        },*/`

これをコメントアウトすると、フォームは 1 つの完全なページのときに送信されます。

別のチュートリアルで上記の ajaxSubmit を見つけましたが、送信をクリックすると、インデックス ページに移動します。

これが私のPHPファイルです:

` ?>

<?php
if( isset($_POST) ){
    //form validation vars
    $formok = true;
    $p_errors = array();

    //sumbission data
    $ipaddress = $_SERVER['REMOTE_ADDR'];
    $date = date('d/m/Y');
    $time = date('H:i:s');

    //form data
    $name = filter_var($_POST['name'], FILTER_SANITIZE_STRING);
    $email = filter_var($_POST['email'], FILTER_SANITIZE_EMAIL);
    $telephone = filter_var($_POST['telephone'], FILTER_SANITIZE_NUMBER_INT);
    $message = filter_var($_POST['message'], FILTER_SANITIZE_STRING);
    $captcha = filter_var($_POST['captcha'], FILTER_SANITIZE_STRING);

    //validate form data

    //validate name is not empty
    if(empty($name)){
        $formok = false;
        $errors[] = "You have not entered a name";
    }   

    //validate telephone is numbers 
    if(empty($telephone)){
        $formok = true;
    }

    //validate email address is not empty
    if(empty($email)){
        $formok = false;
        $errors[] = "You have not entered an email address";
    //validate email address is valid
    }

    //validate message is not empty
    if(empty($message)){
        $formok = false;
        $errors[] = "You have not entered a message";
    }

    //validate captcha is not empty
    session_start();
    if(empty($captcha)){
        $formok = false;
        $errors[] = "Please answer captcha question";
    }
    elseif(strtoupper($_POST['captcha']) == $_SESSION['captcha_id'])
    {
    //Do your stuff
    unset ($_SESSION["captcha_id"]);
    }
    else
    {
    $formok = false;
    $errors[] = "Wrong code entered";
    }

    //send email if all is ok --REMOVED


    //what we need to return back to our form
    $returndata = array(
        'posted_form_data' => array(
            'name' => $name,
            'email' => $email,
            'telephone' => $telephone,
            'message' => $message
        ),
        'form_ok' => $formok,
        'errors' => $errors
    );

    //if this is not an ajax request
    if(empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) !== 'xmlhttprequest'){
        //set session variables
        session_start();
        $_SESSION['cf_returndata'] = $returndata;

        //redirect back to form
        header('location: ' . $_SERVER['HTTP_REFERER']);
    }
}`  

コードを入れすぎていないことを願っていますが、PHP と Jquery の知識は非常に限られていますが、これを解決する必要があるため、提案をいただければ幸いです。

前もって感謝します、ジェームズ

4

1 に答える 1

0

投稿本文を手動で作成しようとしないでください。あなたの方法を使用して導入されるエンコードの問題がたくさんあります。

それ以外の:

var dataString = 'name='+ name + '&email=' + email + '&telephone=' + telephone + '&message=' + message; 

ただ

var dataObj = {"name":name, "email":email, "telephone":telephone};

次に、ajax呼び出しの変更で

data: dataString,

data: dataObj;

これにより、多くのまれなケースとエンコーディングの問題が回避されます。

于 2013-07-18T17:20:15.110 に答える