在当前页面上提交Ajax表单

Ajax form submit on current page

本文关键字：Ajax 表单 提交 当前页      更新时间：2023-09-26

我想通过ajax提交一个表单，并将其发送到我的当前页面，以防止刷新。

我的HTML:

<form id="suchForm" method="post" action="<?=$PHP_SELF?>">
    <input type="text" id="suche" name="suche" placeholder="Suchen"/>
    <input type="submit style="display:none;" />
</form>

顺便说一下，提交按钮是隐藏的，所以我通过按键盘上的返回键来提交表单。

这是我的PHP脚本: 
if ( $_SERVER["REQUEST_METHOD"] == 'POST' ) {
    $suche = $_POST['suche'];
    if (!empty($suche)) {    
        <?php echo $suche ?>
    }  
 }

最后，这是我当前的Ajax脚本:

var frm = $('#suchForm');
frm.submit(function (ev) {
    $.ajax({
        type: frm.attr('method'),
        url: frm.attr('action'),
        data: frm.serialize(),
        success: function (data) {
            alert('ok');
        }
    });
    ev.preventDefault();
    });

表单通过Ajax提交成功。问题:Ajax脚本阻止刷新站点，因此PHP脚本(<?php echo $suche ?>)没有显示任何内容。您是否有任何解决方案，以Ajax发送表单，防止刷新(导致一些javascript应该发生在提交后)，并显示PHP回显?

尝试替换alert('ok');用代码显示ajax响应。像这样的东西应该可以工作- 

var frm = $('#suchForm');
frm.submit(function (ev) {
$.ajax({
    type: frm.attr('method'),
    url: frm.attr('action'),
    data: frm.serialize(),
    success: function (data) {
        $('<NAME_OF_YOUR_CONTAINER_TO_DISPLAY_RESPONSE>').html(data);
    }
});
ev.preventDefault();
});

如果$suche不是empty, php将echo它。如果当时能查看页面，就能看到预期的结果，但在本例中，是AJAX为您完成提交，所以AJAX可以"看到"。如果您希望显示AJAX可以"看到"的内容，那么只需在接收数据的success: function()...中执行您想要的任何操作。你可以用alert(data)代替alert("OK")来获得更多的线索。

相关文章：