0

所以我尝试用 PHP 制作一个非常简单的柱形图演示。它显示了喜欢、不喜欢和中立投票的相对数量。

图像创建代码在“columnmaker.php”中（它有一个PNG 输出），而站点本身是“column.php”。我很确定 columnmaker.php 可以正常工作。

现在这是我在 column.php 中尝试做的事情：

<img src="columnmaker.php" alt="">
...
<form action="" method="POST">
    Like: <input type="number" name="like" min="0" step="100"> <br>
    Dislike: <input type="number" name="dislike" min="0" step="100"> <br>
    Neutral: <input type="number" name="neutral" min="0" step="100"> <br>
    <input type="submit" value="Change!">
</form>

但这一个从未显示实际更改的图像。如果我在表单操作字段中写入“columnmaker.php”，则 HTML 输入不再显示（显然）。

那么，我应该怎么做才能更改图像并同时保持在同一页面上？

4

2 回答 2

1

I don't understand why you haven't been able to define an action and still show the image. You could do something like this:

// form.php
<?php if(!empty($_POST)) { ?>
<img src="columnmaker.php?like=<?php echo $_POST['like']; ?>&amp;dislike=<?php echo $_POST['dislike']; ?>&amp;neutral=<?php echo $_POST['neutral']; ?>" alt="">
<?php } ?>

<form action="form.php" method="POST">
    Like: <input type="number" name="like" min="0" step="100" value="<?php echo !empty($_POST['like']) ? $_POST['like'] : 0; ?>"> <br>
    Dislike: <input type="number" name="dislike" min="0" step="100" value="<?php echo !empty($_POST['dislike']) ? $_POST['dislike'] : 0; ?>"> <br>
    Neutral: <input type="number" name="neutral" min="0" step="100" value="<?php echo !empty($_POST['neutral']) ? $_POST['neutral'] : 0; ?>"> <br>
    <input type="submit" value="Change!">
</form>

Now that you've done that, in columnmaker.php, you can then access $_GET['like'], etc, to generate the image. Make sure your header()'s are correct.

于 2013-06-26T19:44:58.077 回答
0

好吧，如果你想要更多的交互性，我建议你使用 JavaScript 来生成图表，而不是 PHP，但你仍然可以让它工作。

为简单起见，我假设您的网站上加载了 jQuery，并且 column.php 工作正常。

将您的表单更改为：

<img id="dynamicColumns" src="columnmaker.php" alt="">

<form action="" method="POST">
    Like: <input type="number" id="like" name="like" min="0" step="100"> <br>
    Dislike: <input type="number" id="dislike" name="dislike" min="0" step="100"> <br>
    Neutral: <input type="number" id="neutral" name="neutral" min="0" step="100"> <br>
   <input type="submit" id="updateColumns" value="Change!">
</form>

然后你可以使用 jQuery 发送一个 AJAX 请求，并以这种方式捕获响应：

 $('#updateColumns').on('click', function(e) {
      e.preventDefault(); // This statement prevents the form from being submitted
     var like = $('#like').val();
     var dislike = $('#dislike').val();
     var neutral = $('#neutral').val();
     $.ajax({
          type: "POST",
          data: {like:like, dislike:dislike, neutral:neutral}
          url: "columnmaker.php"
     }).done(function(response) {
        d = new Date();
        $("#dynamicColumns").attr("src", "/columnmaker.php?"+d.getTime());
        // latter statement will force the browser to reload image on request. 
     });  
  });

调用中的url参数$.ajax将通过 POST 将所有信息发送到该页面，以便您可以通过以下方式访问PHP 中的likes、dislikes和neutral值：

$_POST['likes'] $_POST['dislikes'],$_POST['neutral']

并以您希望动态生成列的任何方式使用这些变量。

最后注：

要在您的页面中包含 jQuery，只需使用此标记：

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
于 2013-06-26T19:54:09.513 回答