Question

我试图将用户点击表格单元格时jQuery拉出的元素信息发布到一个新页面，该页面将在sql查询中使用该信息（在本例中为id）。即，用户点击一个单元格，他/她点击的作业的id为25，即将传递给我的php页面，该页面向数据库查询具有该id的作业，然后用所述信息填充页面。然后，用户可以更改查询中的信息并提交它以更新数据库表。我有点击功能的id，成功提醒告诉我信息已发布。问题是当页面打开时，它表明发布的名称索引是未定义的。这是我获取信息的脚本：

        <script>
        $(document).ready(function()
        {
            $("table.jobs tbody td#job").click(function()
            {
                var $this = $(this);
                var col   = $this.text();
                var LeftCellText = $this.prev().text();
                if (col == '')
                alert("Please pick another column");
                else
                $.ajax(
                {
                    type:"POST",
                    url:"../php/jobUpdate.php",
                    data:"name=" + LeftCellText,
                    success: function()
                    {
                        window.location = "../php/jobUpdate.php";
                    }
                });
            });
        });
    </script>

这是它发送到的简单的php页面：

$name = $_POST['name'];
echo $name;

我是jQuery的新手，我无法弄清楚为什么这不起作用？

Answer 1

当您使用ajax时，第二页../php/jobUpdate.php处理第一页发送的数据，并返回一个值（如果需要，甚至可以返回一大串html）。

第一页在ajax例程success函数中接收新数据，然后可以更新当前页面。更新部分发生在success:功能中，因此您处于正确的轨道上。

但是在您的成功功能中，您将用户重定向到第二页 - 在已经存在并处理数据之后。 重定向可能不是您想要做的。

尝试替换它：

                success: function()
                {
                    window.location = "../php/jobUpdate.php";
                }

用这个：

                success: function(data)
                {
                    alert(data);
                }

如果您想了解如何使用ajax接收的数据更新第一页，请尝试将空DIV添加到您的html中，如下所示：

<div id="somestuff"></div>

然后，在ajax例程的success:函数中，执行以下操作：

$('#somestuff').html(data);

（注意术语＆＃34;数据＆＃34;可以是任何名称，它只需要匹配函数参数中使用的名称。例如：

success: function(whatzup) {
    alert(whatzup);
}

Answer 2

在您的成功函数上导致窗口重新加载将删除通过.ajax传入的任何变量。

您可以尝试返回数据并在现有页面中使用它。

success: function(msg) {
     $('#someDiv').append(msg);
}

Answer 3

未定义索引的原因是因为您在data-argument中使用了一个字符串，但实际上它是一个类似于数组的对象。：）

data: { name: col }

应该是您需要更改的行。否则我没有看到任何问题。另外，如果我能给你一点想法，我实际上不会使用POST。事实上，我会使用GET。我无法确认这是否是保护程序，但使用$ _SERVER [“HTTP_REFFERER”]您可以检查该请求的来源，以确定是否要让它通过。

我建议的方式是，您在GET请求中发送了ID，并让PHP代码使用json_decode()返回数据。现在在jQuery中，你可以使用$.getJSON(url, function(data){}) - 一个更短，更快一点。

由于您可能会自己裁剪URL，请确保在JS中使用intVal()之类的函数来确保您发送的是整数而不是恶意字符串：）

Answer 4

从您的评论到我之前的帖子，似乎您根本不需要ajax。您只需要HTML中的表单：

<form id="MyForm" action="../php/jobUpdate.php" method="POST">
    <input type="hidden" id="jobID" name="yourJobID">
</form>

请注意，在您在其中放置可见内容之前，表单是不可见的。

您可以在其中选择控件（下拉列表），或者使用隐藏的输入字段（如上面的HTML）可以看不到所有表单元素，您可以使用jQuery填充它们。执行此操作的代码如下所示：

    <script>
    $(document).ready(function() {
        $("table.jobs tbody td#job").click(function() {
            var $this = $(this);
            var col   = $this.text();
            var LeftCellText = $this.prev().text();

            //Set value of hidden field in form. This is how
            //data will be passed to jobUpdate.php, via its `name` param
            $('#jobID').val(LeftCellText); 

            if (col == '')
                alert("Please pick another column");
            else
                $('#myForm').submit();
        });
    });
</script>

如果您向表单添加更多值以发送到jobUpdate.php，请确保每个元素都有一个名称，例如<input type="text" name="selectedJobType">（此元素，type =“text”，将在屏幕上显示）。

在jobUpdate.php文件中，您将获得以下值：

$SJT = $_POST['selectedJobType'];
$id = $_POST["yourJobID"];

//Use these vars in MySQL search, then display some HTML based on results

请注意，$ _POST []数组中引用的key（selectedJobType / yourJobID）始终与HTML标记中指定的name相同。这些名称区分大小写（以及拼写计数）。

希望这不是TMI，只是希望涵盖所有基础。

如何使用jquery发布到新的php页面

4 个答案: