如何使用ajax将数据发送到php_Php_Jquery_Ajax

如何使用ajax将数据发送到php

php jquery ajax

如何使用ajax将数据发送到php,php,jquery,ajax,Php,Jquery,Ajax,我使用此表格： <form class="" method="post" action=""> <input type="hidden" class="old_name" name="old_name" value="<?php echo $dir . '/' . $file; ?>" /> <input type="text" class="new_name form-control" name="new_n

我使用此表格：

<form class="" method="post" action="">
   <input type="hidden" class="old_name" name="old_name" value="<?php echo $dir . '/' . $file; ?>" />               
   <input  type="text" class="new_name form-control" name="new_name" value="" />
   <input type="submit" class="submitmodal rename btn " value="Rename" />                       
</form>

这是php部分

actions.php

，检查他是否得到了这些值：

if( isset($_POST['new_name']) ){
echo $_POST['old_name'] . '<br />' . $_POST['new_name'];

if（isset（$\u POST['new\u name']））{
echo$_POST['old_name'].
.$_POST['new_name']；

我在

中根本没有收到回音。代码有什么问题？

这是一个经过测试的解决方案。如果不起作用，请指定问题（共享错误消息）

PHP

if( isset($_POST['new_name']) ){
    echo $_POST['old_name'] . ' / ' . $_POST['new_name'];
}

HTML

<form class="" method="post" action="">
    <input type="hidden" class="old_name" name="old_name" value="This is the Old Name" />
    <input  type="text" class="new_name form-control" name="new_name" value="This is the New Name" />
    <button type="submit" class="rename btn" value="Rename">Submit Form</button>
</form>


提交表格

JQuery

$(function(){ // this configuration will occur after full html is loaded
    $("form").submit(function(e){
        e.preventDefault(); // prevent form default submit action
        var old_name = $(".old_name").val(); //<--use class .old_name
        var new_name = $(".new_name").val();

        $.ajax({
            url:"php/@principal.php",
            method:"POST",
            data:{ old_name:old_name, new_name:new_name },
            success:function(data) {
                console.log(data);
            }
        });
    });
});

$（function（）{//此配置将在加载完整html后发生
$（“表格”）。提交（功能（e）{
e、 preventDefault（）；//防止表单默认提交操作
var old_name=$（“.old_name”）.val（）；//这是一个经过测试的解决方案。如果不起作用，请指定问题（共享错误消息）
PHP
if( isset($_POST['new_name']) ){
    echo $_POST['old_name'] . ' / ' . $_POST['new_name'];
}

HTML
<form class="" method="post" action="">
    <input type="hidden" class="old_name" name="old_name" value="This is the Old Name" />
    <input  type="text" class="new_name form-control" name="new_name" value="This is the New Name" />
    <button type="submit" class="rename btn" value="Rename">Submit Form</button>
</form>


提交表格

JQuery
$(function(){ // this configuration will occur after full html is loaded
    $("form").submit(function(e){
        e.preventDefault(); // prevent form default submit action
        var old_name = $(".old_name").val(); //<--use class .old_name
        var new_name = $(".new_name").val();

        $.ajax({
            url:"php/@principal.php",
            method:"POST",
            data:{ old_name:old_name, new_name:new_name },
            success:function(data) {
                console.log(data);
            }
        });
    });
});

$（function（）{//此配置将在加载完整html后发生
$（“表格”）。提交（功能（e）{
e、 preventDefault（）；//防止表单默认提交操作
var old_name=$（“.old_name”）.val（）；//您的示例存在一些问题
表单没有任何操作。它将发回自身
您的提交处理程序未调用e.preventDefault（）
您不应该为表单字段和按钮分类选择器。请使用id和id选择器。它们应该是唯一的
下面是一个完全有效的示例：
<?php
$dir = '/somedir/';
$file = 'somefile.txt';
if (isset($_POST['old_name']) && isset($_POST['new_name']) ) {
    echo $_POST['old_name'] . '<br />' . $_POST['new_name'];
    exit();
}
?>
<!doctype html>
<html lang="">

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

<body>
    <form id="renameForm" method="POST" action="ajax.php">
        <input type="hidden" class="old_name" id="old_name" name="old_name" value="<?php echo $dir . '/' . $file; ?>" />
        <input type="text" class="new_name form-control" id="new_name" name="new_name" value="" />
        <input type="submit" class="submitmodal rename btn " value="Rename" />
    </form>
    <div id="echo">

    </div>
    <script>
        $("#renameForm").submit(function(e) {
            e.preventDefault();
            var old_name = $("#old_name").val(); //getting value of old name
            var new_name = $("#new_name").val(); //getting value of new name

            $.ajax({
                url: $(this).attr("action"),
                method: $(this).attr("method"),
                data: {
                    old_name: old_name,
                    new_name: new_name
                }
            }).done(function(response){ //
                $("#echo").html(response);
            });
        });
    </script>
</body>

</html>


你的例子有一些问题
表单没有任何操作。它将发回自身
您的提交处理程序未调用e.preventDefault（）
您不应该为表单字段和按钮分类选择器。请使用id和id选择器。它们应该是唯一的
下面是一个完全有效的示例：
<?php
$dir = '/somedir/';
$file = 'somefile.txt';
if (isset($_POST['old_name']) && isset($_POST['new_name']) ) {
    echo $_POST['old_name'] . '<br />' . $_POST['new_name'];
    exit();
}
?>
<!doctype html>
<html lang="">

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

<body>
    <form id="renameForm" method="POST" action="ajax.php">
        <input type="hidden" class="old_name" id="old_name" name="old_name" value="<?php echo $dir . '/' . $file; ?>" />
        <input type="text" class="new_name form-control" id="new_name" name="new_name" value="" />
        <input type="submit" class="submitmodal rename btn " value="Rename" />
    </form>
    <div id="echo">

    </div>
    <script>
        $("#renameForm").submit(function(e) {
            e.preventDefault();
            var old_name = $("#old_name").val(); //getting value of old name
            var new_name = $("#new_name").val(); //getting value of new name

            $.ajax({
                url: $(this).attr("action"),
                method: $(this).attr("method"),
                data: {
                    old_name: old_name,
                    new_name: new_name
                }
            }).done(function(response){ //
                $("#echo").html(response);
            });
        });
    </script>
</body>

</html>


在success中添加console.log
并检查PHP返回的内容。为什么要获取submit按钮值？按照命名约定，您似乎正在尝试获取隐藏字段中的旧名称。console.log；
不返回任何内容我的意思是在这行console.log（数据）；
之后写入此success:function（数据）{
。如果您没有应用它。在成功中添加console.log
，并检查PHP返回的内容。为什么要获取提交按钮值？按照命名约定，您似乎正在尝试获取隐藏字段中的旧名称。console.log；
不返回任何内容我的意思是编写此console.log（数据）
在这一行之后成功：函数（数据）{
。如果您没有应用它。好的，这次我测试了解决方案。请再看一看。好的，这次我测试了解决方案。请再看一看