我正在尝试使用jQuery将数据发送到后端。如果我控制台记录formdata,那么我会看到9个字段及其值。但是在应该接收数据的php页面中,我在执行var_dump时只看到3个字段。php页面上没有其他代码。
下面是我的jQuery AJAX 调用:
$(document).on("click", "#disputeReturnBtn", function () {
if ($("#rrn").val() == "") {
alert("RRN cannot be empty");
}
if (!$("input[name='dispute']:checked").val()) {
alert("Please choose a step");
}
var disputeform = document.getElementById("disputeForm");
var formData = new FormData(disputeform);
console.log(formData);
$.ajax({
type: "POST",
url: "../../form/scans.php",
data: formData,
contentType: false,
cache: false,
processData: false,
success: function (response) {
disputeform.reset();
console.log(response);
},
error: function (error) {
console.log(error);
},
});
});
为什么我只看到三个字段的数据,而formdata有9个字段?原因是数据没有插入到数据库中,因为不是所有的字段都在那里。
我 AJAX 调用错误吗?
下面是html表单:
<?php
session_start();
if (!isset($_SESSION['loggedin'])) {
header('Location: ../login.php');
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?php echo $_SESSION['company']; ?> Scans</title>
<script src="https://code.jquery.com/jquery-3.6.1.min.js" integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ=" crossorigin="anonymous"></script>
<link rel="stylesheet" href="../assets/css/scans.css">
</head>
<body>
<script>
0
</script>
<div class="horizontal" id="topRow">
<div class="appTitle">
<h1><?php if (isset($_SESSION['company'])) {
echo $_SESSION['company'];
} ?> Scans</h1>
</div>
<div class="userName flex">
<p>Logged in as</p>
<h3><?php if (isset($_SESSION['name'])) {
echo $_SESSION['name'];
} else {
echo "Nobody";
}
?></h3>
</div>
<div class="logoutBtn">
<form action="../logout.php" method="post">
<input type="submit" value="Logout" name="logoutBtn" />
</form>
</div>
</div>
<div class="productScan">
<div class="uploadForm">
<form action="" method="POST" id="disputeForm" enctype="multipart/form-data">
<p class="small">Enter the RRN number and wait 5 seconds for the app to search the database.</p>
<fieldset class="rrnLabel flex">
<label for="rrn">RRN Label <span>*</span></label>
<input type="text" name="rrn" id="rrn" required />
</fieldset>
<fieldset class="returnDate flex">
<label for="returndate">Return date</label>
<input type="text" id="returndate" value="" placeholder="Item found" disabled>
</fieldset>
<fieldset class="userComments flex">
<label for="usercomments">User comments</label>
<textarea type="text" name="user_comments" id="usercomments" value="" placeholder="Comments" disabled></textarea>
</fieldset>
<fieldset class="returnReason flex">
<label for="returnreason">Return reason</label>
<textarea type="text" id="returnreason" , value="" placeholder="Reason for return" disabled></textarea>
</fieldset>
<fieldset>
<div class="explainProcess">
<p>Take a clear picture of the item from all sides.</p>
<ul id="todoList">
<li>Photo 1: Photo of product</li>
<li>Photo 2: Clear Photo of RRN Label</li>
<li>Photo 3: Clear Photo of S-Label</li>
<li>Photo 4: Clear Photo of Bar Code</li>
<li>Photo 5: Clear Photo of Damage</li>
<li>Photo 6: Clear Photo of Damage</li>
</ul>
</div>
</fieldset>
<!-- PhotoS -->
<div class="fieldsetWrap horizontal">
<fieldset class="fileInput relative">
<h4>Product Photo<span>*</span></h4>
<input type="file" ref='file' name="product_photo" id="product_photo" accept="image/jpg, image/png, image/jpeg, image/webp, image/bmp" />
<div class="button absolute">Choose File</div>
<div class="previewImage">
<img id="product_photoImg" />
</div>
</fieldset>
<fieldset class="fileInput relative">
<h4>RRN Label Photo<span>*</span></h4>
<input type="file" ref='file' name="rrn_photo" id="rrn_photo" accept="image/jpg, image/png, image/jpeg, image/webp, image/bmp" />
<div class="button absolute">Choose File</div>
<div class="previewImage">
<img id="rrn_photoImg" />
</div>
</fieldset>
<fieldset class="fileInput relative">
<h4>S-Label Photo</h4>
<input type="file" ref='file' name="slabel_photo " id="slabel_photo" accept="image/jpg, image/png, image/jpeg, image/webp, image/bmp" />
<div class="button absolute">Choose File</div>
<div class="previewImage">
<img id="slabel_photoImg" />
</div>
</fieldset>
<fieldset class="fileInput relative">
<h4>Bar Code Photo</h4>
<input type="file" ref='file' name="barcode_photo " id="barcode_photo" accept="image/jpg, image/png, image/jpeg, image/webp, image/bmp" />
<div class="button absolute">Choose File</div>
<div class="previewImage">
<img id="barcode_photoImg" />
</div>
</fieldset>
<fieldset class="fileInput relative">
<h4>Photo 5</h4>
<input type="file" ref='file' name="photo_5" id="photo_5" accept="image/jpg, image/png, image/jpeg, image/webp, image/bmp" />
<div class="button absolute">Choose File</div>
<div class="previewImage">
<img id="photo_5Img" />
</div>
</fieldset>
<fieldset class="fileInput relative">
<h4>Photo 6</h4>
<input type="file" ref='file' name="photo_6" id="photo_6" accept="image/jpg, image/png, image/jpeg, image/webp, image/bmp" />
<div class="button absolute">Choose File</div>
<div class="previewImage">
<img id="photo_6Img" />
</div>
</fieldset>
</div>
<fieldset class="disputeSteps">
<h3>Next steps with regards to this returned product <span>*</span></h3>
<fieldgroup class="checkboxes">
<ul id="disputeSteps">
<li><input type="radio" name="dispute" id="dispute" value="yes" required>
<p for="disputeReturn">Dispute return with company</p>
</li>
<li><input type="radio" name="dispute" id="nodispute" value="no">
<p for="noDispute">No need to dispute</p>
</li>
<li><input type="radio" name="dispute" id="other" value="other">
<p for="disputeOther">Other</p>
</li>
</ul>
</fieldgroup>
<label for="warehouse_comments">Reason for Dispute</label>
<textarea name="warehouse_comments" id="warehouse_comments" cols="50" rows="5" placeholder="Please provide your comments"></textarea>
<button type="button" id="disputeReturnBtn">Submit</button>
</fieldset>
</form>
</div>
</div>
<script src="../assets/js/scans.js"></script>
</body>
</html>
下面是我的PHP文件:
<?php
var_dump($_POST);
下面是我在控制台中看到的表单数据:
FormData(9) { rrn → "RRN-BZYJJ-VAYX", product_photo → {}, rrn_photo → {}, "slabel_photo " → {}, "barcode_photo " → {}, photo_5 → {}, photo_6 → {}, dispute → "yes", warehouse_comments → "Nothing wrong" }
<entries>
0: rrn → "RRN-BZYJJ-VAYX"
1: product_photo → File { name: "167236-004-AE764A76.jpg", lastModified: 1530003296000, size: 38057, … }
2: rrn_photo → File { name: "39342221_884539318417339_7097049967600074752_n.jpg", lastModified: 1534602632000, size: 50778, … }
3: "slabel_photo " → File { name: "Beer.jpg", lastModified: 1585846680000, size: 75259, … }
4: "barcode_photo " → File { name: "48361261_2187373174923474_3499519716190322688_n.jpg", lastModified: 1544863424000, size: 117241, … }
5: photo_5 → File { lastModified: 1674156665588, size: 0, type: "application/octet-stream", … }
6: photo_6 → File { lastModified: 1674156665588, size: 0, type: "application/octet-stream", … }
7: dispute → "yes"
8: warehouse_comments → "Nothing wrong"
<prototype>: FormDataPrototype { append: append(), delete: delete(), get: get(), … }
下面是我从pphp文件scans.php中的var_dump($_POST)得到的响应:
array(3) {
["rrn"]=>
string(5) "sdfds"
["dispute"]=>
string(2) "no"
["warehouse_comments"]=>
string(0) ""
}
1条答案
按热度按时间gjmwrych1#
问题0
你们中的许多输入都有一个
id
属性,但是没有name
属性。当然,他们需要一个name
属性才能在POST中显示。例如,替换:
与:
问题1
注意,上传的文件不会显示在
$_POST
中,而是显示在$_FILES
中,并且在PHP中的处理方式不同。进一步调试
此外,尝试打开网络跟踪,以进行POST,它使用browser's developer tools。通常打开按下F12,然后转到网络选项卡。