PHP,HTML,Javascript - 从foreach循环创建交互式下拉菜单

时间:2018-02-01 21:50:57

标签: javascript php html foreach

我正在制作一个投票页面,用户可以根据类别对几个有不同答案的民意调查进行投票。为了简单起见:

代码说明

我有2个foreach循环:第一个循环遍历所有轮询,并打印出来。第二个迭代轮询的所有可用答案。从category_id收到多个答案。每个民意调查都会打印出答案。当前显示的方式是每个轮询及其相应的答案在彼此之下打印出来,有点像列表。

我想拥有什么

我想要一个下拉菜单,它会在点击时显示所有可用的民意调查。单击一个轮询时,它必须显示轮询本身和相应的答案。

我对此很陌生,我希望这不是太多的要求,如果是这样,我希望你能指出我至少正确的方向。

代码

<!-- Voting form --> 
<h3> Pollpagina </h3>
<?php
    //prepare statement to select all polls
    $get_polls = $db->prepare('SELECT * FROM polls');
    $get_polls->execute();
    $all_polls = $get_polls->fetchAll();
    //treat every poll as an individual poll
    foreach($all_polls as $single_poll) {
?>  
        <!-- Create a form for each poll, with the corresponding answers as radio buttons -->
        <form method="post" action="">
            <div class="poll">
<?php
                //get textual poll and its corresponding id and category
                $poll_id = $single_poll['id'];
                $poll = $single_poll['poll'];
                $category = $single_poll['category_id'];
                //echo each poll
                echo $poll, "<br>";
                //prepare statement for getting all the answers from a specific category
                $category_answers = $db->prepare('SELECT answer FROM answers WHERE category_id = ?');
                $category_answers->bindValue(1, $category, PDO::PARAM_STR);
                $category_answers->execute();
                $all_answers = $category_answers->fetchAll();
                //create a radio button for each answer
                foreach($all_answers as $single_array_answer) {
                    $single_answer = array_shift($single_array_answer);
?>
                    <input type="radio" name="radio" value="<?php print_r($single_answer); ?>"> <?php print_r($single_answer); ?>  <br>
<?php
                }
?>
                <!-- If a vote has been submitted, the value tag will send the corresponding poll id -->
                <button type="submit" name="submit" value="<?php print_r($poll_id); ?>"</button>Submit
            </div>
        </form>
<?php
    }
?>

1 个答案:

答案 0 :(得分:0)

你可以结合一些php和javacript。

显示民意调查:


[{ID:23,NAME:zz, checked: true},{ID:65,NAME:tt, checked: true},etc]

显示所有民意调查答案使用jquery:

<select id="dropdown">
   <?php
     echo "<option value='$pollId'>$pollName</option>";
   ?>
</select>