Question

以为你可以帮忙解决这个问题，因为我知道自己想要什么，怎么做但是我并不熟悉AJAX / JS，并且在某一点之后我就停止了这些工作。

基本上，我试图在用户提交表单时显示一些文本，但显然只有在表单成功发送时才显示。我的HTMl和PHP在下面，但我不知道我在这一点上做了什么，所以也许有人可以帮我一点。

          <form name="contactform" action="includes/contactprocess.php" method="post">
        <div class="form-group">
    <input type="text" class="form-control" id="fname" name="fname" required placeholder="First Name">
  </div>
        <div class="form-group">
    <input type="text" class="form-control" id="sname" name="sname" required placeholder="Last Name">
  </div>
  <div class="form-group">
     <input type="email" class="form-control" id="email" name="email" required placeholder="Email Address">
  </div>
  <div class="form-group">
    <input type="text" class="form-control" name="subject" required placeholder="Message Subject">
  </div>
    <div class="form-group">
  <textarea rows="3" name="comment" class="form-control" required placeholder="Enter Comment"></textarea>
  </div>
  <button type="submit" class="btn btn-default">Submit</button>
</form>

到目前为止这是PHP：

    <?php
/* Set e-mail recipient */
$myemail  = "myemailhere";

/* Check all form inputs using check_input function */
$fname = check_input($_POST['fname'], "Enter your first name");
$sname = check_input($_POST['sname'], "Enter your second name");
$subject  = check_input($_POST['subject'], "Enter the message subject");
$email    = check_input($_POST['email']);
$comment = check_input($_POST['comment'], "Enter the message you wish to be sent");

/* Error handling and sanitisation for email */
if (!preg_match("/([\w\-]+\@[\w\-]+\.[\w\-]+)/", $email))
{
    show_error("The e-mail you have entered is not valid");
}

/* Let's prepare the message for the e-mail */

$message = "A contact form has been submitted by;

Name: $fname
Surname: $sname
E-mail: $email

Comments:

$comment

Message sent via myemailhere


";
/* Send message via mail function */
mail($myemail, $subject, $message);

if(mail($myemail, $subject, $message)) {
    $data['success'] = true;
}
else{
    $data['success'] = false;
}

// convert the $data to json and echo it
// so jQuery can grab it and understand what happend
echo json_encode($data);

/* Check input */
function check_input($data, $problem='')
{
    $data = trim($data);
    $data = stripslashes($data);
    if ($problem && strlen($data) == 0)
    {
        show_error($problem);
    }
    return $data;
}

function show_error($myError)
{
?>
    <html>
    <body>

    <b>Please correct the following error:</b><br />
    <?php echo $myError; ?>

    </body>
    </html>
<?php
exit();
}
?>

JS / AJAX我真的不明白：

    <script>
    $(document).ready(function() {

// hide the success message
$('#success').hide(); 

// process the form
$('form').submit(function(event) {

    // get the form data before sending via ajax
    var formData = {
        'name'               : $('input[name=name]').val(),
        'number'             : $('input[name=number]').val(),
        'message'            : $('input[name=message]').val(),
        'contactSubmit'      : 1 
    };

    // send the form to your PHP file (using ajax, no page reload!!)
    $.ajax({
        type: 'POST', 
        url:  'file.php', // <<<< -------  complete with your php filename (watch paths!)
        data:  formData,  // the form data
        dataType: 'json', // how data will be returned from php
        encode: true
    })
    // JS (jQuery) will do the ajax job and we "will wait that promise be DONE"
    // only after that, we´ll continue
    .done(function(data) {
        if(data.success === true) {
           // show the message!!!
           $('#success').show();
        }
        else{
            // ups, something went wrong ...
            alert('Ups!, this is embarrasing, try again please!');
            } 
        });
    // this is a trick, to avoid the form submit as normal behaviour
    event.preventDefault();
});
    }); 
</script>

在表单提交上显示表单确认消息

0 个答案: