使用AJAX通过POST / GET提交表单

Question

目前，我的网站上有一个喜欢/不喜欢的功能，该功能将SQL提交到POST上的数据库中，并使用GET检索产品ID和产品类别，因此单击后，当前刷新，并且链接显示为：

"/index.php?id=106&category=Entertainment"

我一直在研究AJAX，并弄清楚了如何使用它来将SQL提交到数据库而无需刷新，但是当我也需要提交GET变量时，我无法使其提交。 我想知道是否有人对此有所了解，因为我一直在尝试所有事情并且没有取得成功。 当前，此函数的代码如下所示：

index.html的：

<form class="form-horizontal" action="?id=' . $productData->getID() . '&category=' . $productData->getPcategory() . '" method="post">
           <button id="like" type="submit" name="like" value="like" class="btn btn-success" onclick="javascript:return like();"><i class="glyphicon glyphicon-thumbs-up"></i></button>

</form>

index.php文件：

if (isset($_POST["like"])) {
    $productDataSet = new productDataSet();
    $productDataSet->addLike();
    $likeDislike = "Product has been added to your <b>likes</b>.";
}

AJAX函数 （可在我网站的其他不需要GET变量的区域使用）：

function like()
{
$.ajax({
    url: "index.php",
    context: document.body
    }).done(function() {

    });
    return false;
}

我知道我需要添加此代码，以便脚本能够在POST上读取GET变量，但是我不知道要添加什么，将不胜感激。

谢谢。

Answer 1

通常，这是一项非常简单的任务，您需要配置一个事件处理程序，并假设您使用的是jQuery（您似乎是），以下代码应该对您的JavaScript起作用：

$(document).on('click', 'a[data-ajax-submission]', function(e)
{
    var link = $(this);
    var action = link.attr('data-ajax-action');
    var id = link.attr('data-resource-id');

    if(action == undefined || id == undefined)
    {
        return;
    }

    e.preventDefault();

    $.ajax({
        url: yourUrl, // Will need to set, could also use a data attribute again
        type: 'POST',
        data: {
            action: action,
            id: id
        },
        dataType: 'json',
        context: document.body
    }).always(function(response)
    {
        // Do stuff here
    })
});

这将导致单击具有data-ajax-submission属性的任何元素以触发此事件。

然后，我们执行一个操作，并从其他数据属性中获取一个id并将其作为ajax请求中的POST数据发送到服务器，如下所示：

<a data-ajax-submission data-ajax-action="resource-like" data-resource-id="1">Like</a>

我已经使用术语“资源”作为占位符，无论它是“产品”还是“类别”。

然后在PHP中，您可以像处理其他任何表单请求一样处理它：

if(isset($_POST['action']) && $_POST['action'] == 'resource-like')
{
    // Check for an ID & any other validation
    // Persist, do stuff, etc...

    die(json_encode(array(
         'success' => $success
    )));

}

这是一种灵活的解决方案，它应允许您执行一些任务，而不必进一步修改JavaScript方面。

值得注意的是，通常对于喜欢，不喜欢，投票等行为，您需要将投票限制为每个访问者一次，通常是通过设置cookie来实现的。

如果您有任何后续问题等，请告诉我...

Answer 2

我不确定我是否理解问题，但是如果您想同时提交GET和POST变量，则可以尝试以下肮脏的把戏：

$.post( "someFile.php?var1=value1&var2=value2", {
     var3 : value3 ,
     var4 : value4 })

在PHP中，请阅读：

$_GET['var1']
$_GET['var2']
$_POST['var3']
$_POST['var4']