PHP表单保持在同一页面

3

您好,我正在尝试从与PHP代码相同的页面上的表单更新数据库中的数据,而不需要重定向/重新加载页面。

我尝试了这个教程,但没有成功:http://www.formget.com/form-submit-without-page-refreshing-jquery-php/

更新代码:

<?php
include "db.php";
session_start();
$value=$_POST['name'];
$query = mysqli_query($connection,"UPDATE users SET profiel='$value' WHERE username='$_SESSION['user']'");
?>

Profilecomplete.js:

$(document).ready(function() {
    $("#submit").click(function() {
        var name = $("#name").val();
        if (name == '') {
            alert("Insertion Failed Some Fields are Blank....!!");
        } else {
        // Returns successful data submission message when the entered information is stored in database.
            $.post("config/profilecomplete.php", {
                value: name
            }, function(data) {
                alert(data);
                $('#form')[0].reset(); // To reset form fields
            });
        }
    });
});

表格:
<form method="POST" id="form">
    <div class="input-field col s6">
        <input id="name" type="text" class="validate">
        <label for="name">Value</label>
    </div>
    <button type="submit" id="submit" class="btn-flat">Update</button>
</form>

你有这方面的示例/教程吗? - Amando Vledder
你能否编辑你的问题并提供更多你正在使用的代码?我还没有阅读这个教程,但是我认为可能会使用某种形式的jQuery ajax,并且我确定我不是唯一想要跟着整个教程回答你的问题的人。 - Lewis
谢谢。还有一个问题,您的控制台是否收到任何错误提示或页面上的PHP错误? - Lewis
在发布之前,我检查了第一件事 ;) - Amando Vledder
你所需要的是一个 SPA,参见 https://en.wikipedia.org/wiki/Single-page_application 或者至少其中的组件。 - Pogrindis
我可以看出你还在学习PHP。所以,一个小提示:永远不要让用户输入填充查询而没有转义它。这是很危险的(SQL注入)。转义的方法是:$value= mysqli_real_escape_string ($connection, $_POST['name']); - Roboroads
3个回答

0

即使您未阻止表单提交按钮的默认行为,也可以发生单击事件。将提交输入设置为按钮或使用event.preventDefault()通过ajax提交表单。

<?php
include "db.php";
session_start();

if(isset($_POST)) {
    $value=$_POST['name'];
    $query = mysqli_query($connection,"UPDATE users SET profiel='$value' WHERE username='{$_SESSION['user']}'");
    echo ($query) ? "Updated" : "Not Updated";
    exit;
} else {
?>
<form method="POST" id="form">
    <div class="input-field col s6">
        <input id="name" type="text" class="validate" name="name">
        <label for="name">Value</label>
    </div>
    <button type="button" id="submit" class="btn-flat">Update</button>
</form>
<?php } ?>

<script type="text/javascript">
$(document).ready(function() {
    $("#submit").click(function() {
        var name = $("#name").val();
        if (name === '') {
            alert("Insertion Failed Some Fields are Blank....!!");
        } else {
            // Returns successful data submission message when the entered information is stored in database.
            $.post("config/profilecomplete.php", {name: name}, function(data) {
                alert(data);
                $('form')[0].reset(); // To reset form fields
            });
        }
    });
});
</script>

这给了我注意:未定义索引:name in,并且只显示“已更新”。 - Amando Vledder
更新了我的答案。将{value: name}更改为{name:name}。 - Manish Jangir

0

看起来问题,或者至少是其中一个问题,在这一行上;

$query = mysqli_query($connection,"UPDATE users SET profiel='$value' WHERE username='$_SESSION['user']'");

你在这里打开和关闭单引号两次

WHERE username='$_SESSION['user']'

试着使用这个替代方案;

$query = mysqli_query($connection,"UPDATE users SET profiel='$value' WHERE username='" . $_SESSION["user"] . "'");

0

使用这个,它已经可以工作了。

index.php

<form method="post">
    <input type="text" id="name">
    <input type="submit" id="submit">
</form>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script> 
$(document).ready(function() {
    $("#submit").click(function(e) {
        e.preventDefault();
        var nameInput = $("#name").val();
        var name = {
            'name' : nameInput
        }
        if (nameInput == '') {
            alert("Insertion Failed Some Fields are Blank....!!");
        } else {
            // Returns successful data submission message when the entered information is stored in database.
            $.post("config/profilecomplete.php", {value: name}, function(data) {
                alert(data);
                //$('#form')[0].reset(); // To reset form fields
            });
        }
    });
});
</script>

profilecomplete.php

<?php

$_POST = array_shift($_POST); // array_shift is very important, it lets you use the posted data.

echo $_POST['name'];


?>

如果你想要更简单的方式,可以尝试使用$.ajax()

你怎么从这里获取 $_POST['name'] 的值? - Manish Jangir
'name' : nameInput // this name here - Ulysses
这个可行,但会弹出一个带有错误信息的弹窗。有办法解决吗?http://i.imgur.com/PFPpLTz.png 第27行:$value=$_POST['name']; - Amando Vledder
或者像这样'name' : $("#name").val(), 'pass': $("#pass").val()。该术语为“键值对”,这是一个对象。 - Ulysses
我遇到的另一个问题是,如果我例如发布了两个不同的内容,它们都会发布来自输入1的数据。 - Amando Vledder
显示剩余2条评论

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接