duanfu1945 2011-08-05 04:46
浏览 50
已采纳

如何使用jQuery AJAX提交此表单?

I have a PHP email form and the user enters their email and it sends them the link to the file they uploaded. How would I submit that form with AJAX?

Right now, I have it where they click on a link to go to the page with the email form on it, and I am passing the $target_path variable in the URL so the link to the uploaded file can be in the email. Here's the PHP I have on the "Successfully uploaded" page to go to email.php:

<?php echo "<a href='email.php?target_path=".$target_path."'>Click here</a> to get the link sent to your email." ?>

Here's the source of email.php:

<html>
<head>
<title>Upload File</title>
<style type="text/css">
body {
font-family:arial,sans-serif;
}
.error {
color:red;
}
</style>
</head>
<body>
<?php
function spamcheck($field)
  {
  //filter_var() sanitizes the e-mail
  //address using FILTER_SANITIZE_EMAIL
  $field=filter_var($field, FILTER_SANITIZE_EMAIL);

  //filter_var() validates the e-mail
  //address using FILTER_VALIDATE_EMAIL
  if(filter_var($field, FILTER_VALIDATE_EMAIL))
    {
    return TRUE;
    }
  else
    {
    return FALSE;
    }
  }

if (isset($_REQUEST['email']))
  {//if "email" is filled out, proceed

  //check if the email address is invalid
  $mailcheck = spamcheck($_REQUEST['email']);
  if ($mailcheck==FALSE)
    {
    echo "Invalid email, please try again.";
    }
  else
    {//send email
    $to = $_REQUEST['email'] ;
    $subject = "Your file has been uploaded to our site and here's a link to it" ;
    $message = "
Hello,

Your file has been uploaded to our site. Here is a link to it for future reference, keep this email if you want to remember the link to your file: http://www.example.com/upload/".$_REQUEST['target_path']."

Thank you.";

    mail($to,$subject,$message, "From: noreply@example.com" );
    echo "Email has been sent. Please check your inbox and/or spam folder.";
    }
  }
else
  {//if "email" is not filled out, display the form
  echo "<form method='post' action=''>
  Email: <input name='email' type='text' /><br /><br />
  <input type='submit' />
  </form>";
  }
?>
</body>
</html>

As you can see, when they click the link to go to email.php on the "Successfully Uploaded File" page (upload.php) it passes the $target_path variable so it will be able to send a link to the uploaded file.

I would like to put the email form right on upload.php (the page where the file upload form gets submitted to) and then submit that email form with jQuery AJAX. I just don't know how to make that work. I'll also need that variable to still be passed, but I don't think it would be in the URL, it would probably be in somewhere else in the AJAX code.

Any help is greatly appreciated.

Thanks,
Nathan

  • 写回答

3条回答 默认 最新

  • dongtaoxue4674 2011-08-05 06:03
    关注

    Following is the JS bit of code

    $(document).ready(function(){
    
        $('#emailbtn').click(function(){
                //This is short form of php echo
            var target_path = <?php=$target_path?> 
    
                //Get eMail from input
                var email = $('#email').val(); 
    
                //Send form to email.php using GET method
            $.ajax(
            {
                type: "GET",
                url: "email.php",
                data: ({"target_path" :  target_path, "email" : email}),
                success: function(message)
                {   
                    $("#btnspan").empty().append(message);
                }
            });         
        });
    });
    

    This is HTML bit of code

    <span id="btnspan">Your eMail: <input type="text" name="email" id="email" /> <button id="emailbtn" class="button">eMail me the link</button></span>
    

    Seems your email.php return valid messages, so what will happen when you click on the button is that content provided by your php will replace the form content! Page does NOT refresh.

    One thing I would suggest you change is the GET method, change it to POST! For php I assume you know it's $_POST[varname] to retrieve the value and for the JS, just change AJAX type to POST.

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题?

悬赏问题

  • ¥15 matlab有关常微分方程的问题求解决
  • ¥15 perl MISA分析p3_in脚本出错
  • ¥15 k8s部署jupyterlab,jupyterlab保存不了文件
  • ¥15 ubuntu虚拟机打包apk错误
  • ¥199 rust编程架构设计的方案 有偿
  • ¥15 回答4f系统的像差计算
  • ¥15 java如何提取出pdf里的文字?
  • ¥100 求三轴之间相互配合画圆以及直线的算法
  • ¥100 c语言,请帮蒟蒻写一个题的范例作参考
  • ¥15 名为“Product”的列已属于此 DataTable