如何从复选框中获取选定的多个值并以表单形式提交以获取匹配的搜索结果

Question

此表单包含一个下拉列表，其中包含多个带有复选框的选项，现在当用户选择 1 个或多个复选框并按下提交时，应使用匹配的搜索结果处理这些值。 以前，我有一个select标签和一个用于获取结果的option标签。 现在，由于我添加了搜索多个选项的功能，我添加了复选框，但现在我不确定如何获得结果。

Html 和 Php 代码

<form action="<?php the_permalink() ?>" class="ajax-search-form leaders-header" id="searchform" method="post" role="search">
        <?php get_template_part( 'blocks/leaderboard/search-form' ) ?>
        <div class="sort">

        <body>
        <?php if ($departments = get_field_object('field_5da06da87ae0f')) : ?>
        <div class="sort-item">
        <div id="list1" class="dropdown-check-list" tabindex="100">
            <span class="anchor" style="font-size: small">All Departments</span>
            <ul id="items" class="items" name="department" >
                <label for="test">
                <?php foreach ($departments['choices'] as $key => $department) : ?>
                    <input type="checkbox" name="check" id="test" value="unchecked" /> <option style="font-size: small" <?php if ( isset($_REQUEST['role']) and $_REQUEST['role'] == $key) echo 'selected' ?> value="<?php echo $key; ?>">

                        <?php echo $department; ?></option></label></br>

                <?php endforeach; ?>

                <input style="font-size: small" type="submit" value="Submit" "/>
            </ul>
        </div>
        </div>
        <?php endif ?>
        </body>

JavaScript：

<script type="text/javascript">

            var checkList = document.getElementById('list1');
            var items = document.getElementById('items');
            var isChecked = document.getElementById('items').checked;
            checkList.getElementsByClassName('anchor')[0].onclick = function (evt) {
                if (items.classList.contains('visible')){
                    items.classList.remove('visible');
                    items.style.display = "none";
                }
                else{
                    items.classList.add('visible');
                    items.style.display = "block";
                }

            }

            items.onblur = function(evt) {
                items.classList.remove('visible');
            }


        </script>

Answer 1

问题是每个复选框都将具有相同的名称和 ID，因此您将无法识别哪个选项属于哪个复选框，但您可以尝试这样的事情

<?php foreach ($departments['choices'] as $key => $department) : ?>
                    <input type="checkbox" name="<?= $department ?>" id="<?= $department ?>" value="unchecked" />

如何从复选框中获取选定的多个值并以表单形式提交以获取匹配的搜索结果

问题描述

1 个解决方案

解决方案1
0 2019-11-08 22:16:21

如何从复选框中获取选定的多个值并以表单形式提交以获取匹配的搜索结果

问题描述

1 个解决方案

解决方案1 0 2019-11-08 22:16:21

解决方案1
0 2019-11-08 22:16:21