Html表单不适用于Php，Ajax请求

Html form is not working with Php, Ajax request

本文关键字：Ajax 请求 Php 适用于 表单 不适用 Html      更新时间：2023-09-26

你好，下面是我的html表单，我想用Ajax验证它。这样浏览器就不会加载页面。如果用户输入名字，它应该在html表单上方显示名字。但它不显示。。。

Html形式：

<form id="validation"/>
<table width="500" border="0" cellspacing="10" cellpadding="0">
  <tr>
    <td>First Name</td>
    <td><input type="text" name="fname" value="<?php if(isset($_POST['fname'])) echo $_POST['fname']; ?>" class="tr" placeholder="First Name"/></td>
  </tr>
  <tr>
    <td></td>
    <td><input type="reset" name="reset" value="Clear" class="submit"/>&nbsp;&nbsp;<input type="submit" name="Submit" id="submit" value="Registration" class="submit"/></td>
  </tr>
</table>    
</form>
<script>
    $('#validation').submit(function(event) {
        event.preventDefault();
        $.ajax({
            type: 'POST',
            url: 'regProcess.php',
            data: $(this).serialize(),
            dataType: 'json',
            success: function (data) {                    
            }
        });
    });
</script>

Php代码：

<?php
if(isset($_POST['Submit']) && $_POST['Submit'] == "Registration"){
    $fname =  $_POST['fname'];
    echo $fname;        
    }
?>

在代码的底部，您可以看到：

            success: function (data) {                    
        }

这是你的问题。您不需要对返回的"数据"执行任何操作——您需要使用javascript或jquery将其插入DOM的某个位置。编辑：更新

要使用jquery将数据插入dom，请执行以下操作：

            success: function (data) {                    
                $("#id of the element where you want the data").innerHTML+=data
            }

这将把从AJAX中检索到的"数据"附加到具有特定ID的元素中。我相信你可以在$（"HERE"）中使用任何CSS选择器。

相关文章：