javascript - 使用ajax将表单数据和文件传递给php

标签 javascript php jquery html ajax

<分区>

以前可能有人问过这个问题,但我在这里和谷歌上搜索过,我读过的每个答案都没有用。

我要解决的问题是制作一个包含名字、姓氏、电子邮件和图像的表格。然后将数据传递到数据库并将文件也上传到数据库。目前我的代码在我按下提交后没有做任何事情。在我添加文件框之前,它会将数据插入到我的数据库中。

HTML

<form id="myForm" method ="post" enctype="multipart/form-data">
    First Name: <input type="text" name="fname" id="fname"> <br>
    Last Name: <input type="text" name="lname" id="lname"> <br>
    Email:  <input type="text" name="email" id="email"> <br>
    Image: <input type="file" name="image" id="image"> <br>
    <button type="button" name="btnSubmit" id="btnSubmit"> Submit </button>
</form>

AJAX/JS

$("#btnSubmit").click(function(){
     var formData = new FormData($(this)[0]);
     $.ajax({
        type: 'POST',
        url: 'form2.php',
        data: formData,
         success: function (data) {
           alert(data)
         },
      });
  });

PHP

$upload = basename($_FILES['image']['name']);
$type = substr($upload, strrpos($upload, '.') + 1);
$size = $_FILES['image']['size']/1024; 

if ($_FILES["image"]["error"] > 0)
{
    echo "Error: " . $_FILES["image"]["error"] . "<br>";
}
else
{
    echo "Upload: " . $upload . "<br>";
    echo "Type: " . $type . "<br>";
    echo "Size: " . $size . " kB<br>";
}

$fname = $_POST['fname'];
$lname = $_POST['lname'];
$email = $_POST['email'];
echo "You Entered <br />";
echo "<b>First Name:</b> ". $fname . "<br />";
echo "<b>Last Name:</b> ". $lname . "<br />";
echo "<b>Email:</b> ". $email . "<br />";

最佳答案

表单默认提交到他们被告知的任何地方。为了阻止这种情况,您需要阻止它。你的 js 应该看起来像这样:

$("form#data").submit(function(event){
    event.preventDefault();
    ...
});

关于javascript - 使用ajax将表单数据和文件传递给php,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19736272/

相关文章:

javascript - 我的 html5 应用程序无法显示模型

php - SUM() 在 MySQL : SUM() with DISTINCT 中不起作用

javascript - jquery,防止父元素上的 onclick=window.location

jquery - 为什么我的服务器忽略来自 ajax 请求的身份验证 header ?

javascript - 当activex与flash播放器位于同一页面时,无法调用activex方法

javascript - 在特定时间段内暂停javascript线程

javascript - 将 Promise 与之前的结果链接起来

php - 在 PHP 中,是否有一种简单的方法来获取一个月的第一个和最后一个日期?

php - 为 PHP CLI 安装 Xdebug

javascript - 在 Angular 2 中如何将数组字符串元素放入模板元素值属性中?