使用结果页面创建交互式轮询

Question

我正在寻找创建一个民意调查/表格，允许用户选择足球比赛的首发11（如果你是美国人，则选择足球），然后提交，然后查看最受欢迎的图像球迷之间的球队选择（可能是每个位置最受欢迎，而不是最受欢迎的球队选择）。

理想情况下，我希望表格有形成选项（4-4-2,4-3-3,4-5-1等），这些选项会改变表格上的布局/输入（但这绝对不是本质上，只是一个很好的接触 - 我会坚持4-4-2否则）。

我的梦想是底部会有一个仪表板，其中有玩家个人资料图片，可以拖放到他们的位置;然而，有简单的下拉框也可以工作（只要玩家不能使用两次 - 这是另一个绊脚石，因为你不希望同一个玩家同时在两个CB位置。）

设计概念（结果页面基本上没有底部仪表板）：

我完全不知道如何处理这个问题，因为它比我过去尝试过的任何事情都复杂得多。 （忘记提及我希望能够每周重置结果，如果可能的话）

所以，如果有人能让我知道它是否可行，如果是的话，请带我一步一步地去做，或者甚至为我嘲笑一下，我将非常感激。

感谢。

Answer 1

它不一定是一种形式。

在这里你是如何做到的：

1. 为字段上的方块创建div。 为每个人分配一个唯一的ID，例如 id =“square-1”

   并给他们一个共同的类，例如class="field-square"

2. 为字段外的方块创建div。给他们一个共同的类，每个人都有一个唯一的ID。

3. 当您放下方块时，有一个函数可以在丢弃时提取ID。 然后使用jQuery.post()

将它们发布到您的PHP站点

<强>更新

要提取id，在你的回调中（放弃方块后）执行以下操作：     <击>     square_id = square_id.replace（'square-'，''）;     

由于您没有分配号码ID（您应该这样做，以便将来可以通过从数据库中获取玩家来轻松更改玩家），您可以在回调中使用$(this).attr('id')简单地获取ID。

同时查看http://api.jquery.com/jQuery.post/

Answer 2

我甚至不会想到拖拽这一点。概述最小可行产品的含义，并提出一系列步骤。

关掉你提供的数据，我会建议像这样......

1）构建一个html表单，其中列出了所有位置的列表以及可填充该位置的所有可能玩家的下拉列表。

2）填写表格（选择球员）并在表格提交中将数据回显为数组。

3）创建图形......我看到两种方法....（1）服务器端（GD或Imagick可能是你想要使用的）或（2）CSS / html图像

任何一个都是一个很好的方法......这个步骤应该分成几个小步骤......首先简单地显示一个列表和旁边的玩家的图像...

HTML将是

echo "<img src='/images/players".$_POST["position1"]."' alt=''/>"; 
//(NOTE YOU HAVE TO CLEAN ANY DATA YOU ARE OUTPUTTING PROPERLY)

Imagick就像......

$bg = new Imagick("/images/bg.jpg");
$position = new Imagick("/images/players".$_POST["position1"]);

//Second image is put on top of the first
$bg->compositeImage($position, $position->getImageCompose(), 5, 5);

//new image is saved as final.jpg
$bg->writeImage('final.jpg');