javascript - ajax [文件 1] -> php [文件 2] -> $_POST [文件 1]
问题描述
我正在使用 HTML、Javascript 和 PHP 构建预算应用程序。我的目标是让用户能够从提供的表单将数据添加到数据库中。我的“dashboard.php”(包含表单)顶部已经有大量 php,所以我不想在提交时运行 dashboard.php,所以我创建了一个按钮来执行 AJAX 调用不同的 php 文件“addIncome.php”。
我有两个不同的文件...
仪表板.php & addincome.php
dashboard.php 包含我的表单,以及用于运行 AJAX 调用的 javascript。
addincome.php 正在使用 $_POST 从dashboard.php 中的表单中获取值并创建一个mysqli_query。然而,起初什么都没有发生,所以我决定从我的 $_POST 中回显其中一个返回值的值。最后得到这个错误......
undefined index iName in addIncome.php
undefined index iAmount in addIncome.php
所以从那里我虽然默认情况下我可能无法访问dashboard.php,所以我包括了......
include('dashboard.php');
还是没区别...
我真的在这里停滞不前。有什么想法吗?
谢谢
表格...
<form>
<input type="text" name="iName" placeholder="income name">
<input type="number" step="0.01" min="0" name="iAmount" placeholder="amount">
<input type="date" name="iDate">
</form>
javascript...
<script>
$('.in-btn').click(function() {
$.ajax({
url: "addIncome.php",
type: "POST",
data: 'show=content',
success: function(data) {
$('.in-btn').html(data);
}
});
setTimeout(() => {
// location.reload();
}, 2000);
});
</script>
php...
<?php
echo "adding...";
require_once('connection.php');
include('dashboard.php');
$iUser = $_SESSION["username"];
$iName = $_POST["iName"];
$iAmount = $_POST["iAmount"];
echo $iName;
$sql = "INSERT INTO income (user, name, amount, date) VALUE ('pmanke', '$iName', '$iAmount','1/16/19')";
mysqli_query($dbCon, $sql);
?>
解决方案
您不会通过 AJAX 调用发送任何发布数据,但以下情况除外:
show=content
。您想发送表单数据。您可以通过以下方式检索表单数据:
$("#id-of-form").serialize()
这样,您的 PHP 代码就能够从您的 POST 数据中检索正确的值。
更通用的方法是创建一个带有提交按钮和操作的普通表单,并使用 javascript 来捕获提交事件并进行 AJAX 调用:
HTML:
<form id="idForm" action="addIncome.php">
<input type="text" name="iName" placeholder="income name">
<input type="number" step="0.01" min="0" name="iAmount" placeholder="amount">
<input type="date" name="iDate">
<input type="submit" />
</form>
Javascript:
$("#idForm").submit(function(e) {
var form = $(this);
var url = form.attr('action');
$.ajax({
type: "POST",
url: url,
data: form.serialize(), // serializes the form's elements.
success: function(data) {
alert(data); // show response from the php script.
}
});
e.preventDefault(); // avoid to execute the actual submit of the form.
});
推荐阅读
- python - SyntaxError:在文件 {the location of the thing} 第 138 行中以 '\xe2' 开头的非 UTF-8 代码,但未声明编码;见 http://python.org/
- javascript - 使用 Angularjs 在拖放时创建元素的副本
- c++ - 将继承的类传递给采用基类的函数
- excel - 将数据从 Matlab(.mat 文件)导出到特定范围内的现有 Excel 工作表中
- jquery - 由于 jQuery,Bootstrap 4 轮播不工作
- reactjs - Formik 字段不显示输入的值
- c++ - 我用什么来获得更好的性能:成对向量还是二维数组?
- javascript - 无法访问我作为字符串传递的 DOM。如何使用我在代码中定义的外部函数来做到这一点?
- javascript-objects - 在对象数组中使用 forEach 添加新属性
- java - javax 自定义验证器的 Junit 测试用例