如何修复 Wordpress 中表单提交的重复？

Question

我正在修复 wordpress 中的默认搜索表单。我只是设置了一些过滤器让用户选择然后单击确定以使用过滤器进行搜索并且除标签复选框外一切正常。

我尝试了所有这些： tag (string) – 使用标签 slug。 tag_id (int) – 使用标签 ID。 tag__and（数组）——使用标签 ID。 tag__in（数组）——使用标签 ID。 tag__not_in（数组）——使用标签 ID。 tag_slug__and（数组）——使用标签块。 tag_slug__in（数组）——使用标签块。

但是结果是一样的

我在 searchform.php

中的搜索表单

<form role="search" method="get" id="searchform" class="skytube-search-form" action="<?php echo home_url( '/' ); ?>">
    <input type="search" placeholder="<?php esc_attr_e( 'Search for what you want...', 'aldoustech' ); ?>" value="<?php the_search_query(); ?>" name="s" id="s" onkeyup="search()">
    <label for="order">الترتيب حسب التاريخ</label>
    <select name="order">
        <option <?php if ($_GET['order'] == 'ASC') { ?>selected="true" <?php }; ?>value="ASC">الأقدم</option>
        <option <?php if ($_GET['order'] == 'DESC') { ?>selected="true" <?php }; ?>value="DESC">الأحدث</option>
    </select>
    <label for="posts_per_page">عدد النتائج المعروضة</label>
    <select name="posts_per_page">
        <option <?php if ($_GET['posts_per_page'] == '10') { ?>selected="true" <?php }; ?>value="10">10</option>
        <option <?php if ($_GET['posts_per_page'] == '50') { ?>selected="true" <?php }; ?>value="50">50</option>
        <option <?php if ($_GET['posts_per_page'] == '100') { ?>selected="true" <?php }; ?>value="100">100</option>
    </select>
    <label for="category_name">التصنيف</label>
    <select name="category_name">
        <option <?php if ($_GET['category_name'] == '') { ?>selected="true" <?php }; ?>value="">
            الكل
        </option>
        <option <?php if ($_GET['category_name'] == 'مسلسلات-أنمي') { ?>selected="true" <?php }; ?>value="مسلسلات-أنمي">
            مسلسلات أنمي
        </option>
        <option <?php if ($_GET['category_name'] == 'مسلسلات آسيوية') { ?>selected="true" <?php }; ?>value="مسلسلات آسيوية">
            مسلسلات آسيوية
        </option>
        <option <?php if ($_GET['category_name'] == 'مسلسلات-الأنيميشن-و-الكرتون') { ?>selected="true" <?php }; ?>value="مسلسلات-الأنيميشن-و-الكرتون">
            مسلسلات الأنيميشن و الكرتون
        </option>
        <option <?php if ($_GET['category_name'] == 'أفلام-أنمي') { ?>selected="true" <?php }; ?>value="أفلام-أنمي">
            أفلام أنمي
        </option>
        <option <?php if ($_GET['category_name'] == 'أفلام آسيوية') { ?>selected="true" <?php }; ?>value="أفلام آسيوية">
            أفلام آسيوية
        </option>
        <option <?php if ($_GET['category_name'] == 'أفلام-الأنيميشن-و-الكرتون') { ?>selected="true" <?php }; ?>value="أفلام-الأنيميشن-و-الكرتون">
            أفلام الأنيميشن و الكرتون
        </option>
    </select>
    <div>
        <?php
            if( $terms = get_terms( array(
                'taxonomy' => 'post_tag',
                'orderby' => 'name'
            ) ) ) : 
                foreach ( $terms as $term ) :
                    echo '<input type="checkbox" name="tag" value="' . $term->slug . '"' . (($_GET['tag'] ==  $term->slug)?'checked':"") . '> ' . $term->name;
                endforeach;
            endif;
        ?>
    </div>
    <input type="submit" id="searchsubmit" value="<?php esc_attr_e( 'Search', 'aldoustech' ); ?>">
</form>

当我选择一些过滤器然后点击搜索时，url 变成了类似的东西。

http://localhost:8080/wordpress/?s=&order=ASC&posts_per_page=10&cat=3

当我选择一个标签时，url 看起来像这样

http://localhost:8080/wordpress/?s=&order=ASC&posts_per_page=10&cat=3&tag=hello

两个 url 都很好，但是当我选择多个标签时 url 就变成了这样。

http://localhost:8080/wordpress/?s=&order=ASC&posts_per_page=10&cat=3&tag=hello&tag=bye

您可以看到 tag=hello&tag=bye

的副本

这个表格没有得到我想要的结果，因为它必须是这样的：

tag=hello+bye

Answer 1

这段代码对我有用。

// In footer.php
            <script type="text/javascript">
                // Get the selected tags in search
                function getTheCheckedTags() {
                    var items = document.getElementsByName('tags');
                    var selectedItems = "";
                    for(var i=0; i<items.length; i++){
                        if(items[i].type=='checkbox' && items[i].checked==true)
                            selectedItems+=items[i].value+",";
                    }
                    document.getElementsByName('tag')[0].value = selectedItems;
                }
                document.getElementById('searchform').addEventListener('change', getTheCheckedTags);
            </script>
// Don't forget to call the Jquery before this code.
            <script>
            $('#searchform').submit( function(){
              var tags = $('.tags');
              tags.prop('disabled', true);
            });
            </script>

// In searchform.php
<form role="search" method="get" id="searchform" class="skytube-search-form" action="<?php echo home_url( '/' ); ?>">
    <input type="search" placeholder="<?php esc_attr_e( 'Search for what you want...', 'aldoustech' ); ?>" value="<?php the_search_query(); ?>" name="s" id="s" onkeyup="search()">
    <label for="order">الترتيب حسب التاريخ</label>
    <select name="order">
        <option <?php if ($_GET['order'] == 'ASC') { ?>selected="true" <?php }; ?>value="ASC">الأقدم</option>
        <option <?php if ($_GET['order'] == 'DESC') { ?>selected="true" <?php }; ?>value="DESC">الأحدث</option>
    </select>
    <label for="posts_per_page">عدد النتائج المعروضة</label>
    <select name="posts_per_page">
        <option <?php if ($_GET['posts_per_page'] == '10') { ?>selected="true" <?php }; ?>value="10">10</option>
        <option <?php if ($_GET['posts_per_page'] == '50') { ?>selected="true" <?php }; ?>value="50">50</option>
        <option <?php if ($_GET['posts_per_page'] == '100') { ?>selected="true" <?php }; ?>value="100">100</option>
    </select>
    <label for="category_name">التصنيف</label>
    <select name="category_name">
        <option <?php if ($_GET['category_name'] == '') { ?>selected="true" <?php }; ?>value="">
            الكل
        </option>
        <option <?php if ($_GET['category_name'] == 'مسلسلات-أنمي') { ?>selected="true" <?php }; ?>value="مسلسلات-أنمي">
            مسلسلات أنمي
        </option>
        <option <?php if ($_GET['category_name'] == 'مسلسلات آسيوية') { ?>selected="true" <?php }; ?>value="مسلسلات آسيوية">
            مسلسلات آسيوية
        </option>
        <option <?php if ($_GET['category_name'] == 'مسلسلات-الأنيميشن-و-الكرتون') { ?>selected="true" <?php }; ?>value="مسلسلات-الأنيميشن-و-الكرتون">
            مسلسلات الأنيميشن و الكرتون
        </option>
        <option <?php if ($_GET['category_name'] == 'أفلام-أنمي') { ?>selected="true" <?php }; ?>value="أفلام-أنمي">
            أفلام أنمي
        </option>
        <option <?php if ($_GET['category_name'] == 'أفلام آسيوية') { ?>selected="true" <?php }; ?>value="أفلام آسيوية">
            أفلام آسيوية
        </option>
        <option <?php if ($_GET['category_name'] == 'أفلام-الأنيميشن-و-الكرتون') { ?>selected="true" <?php }; ?>value="أفلام-الأنيميشن-و-الكرتون">
            أفلام الأنيميشن و الكرتون
        </option>
    </select>
    <div>
        <?php
            if( $terms = get_terms( array(
                'taxonomy' => 'post_tag',
                'orderby' => 'name'
            ) ) ) : 
                foreach ( $terms as $term ) :
                    echo '<input class="tags" type="checkbox" name="tags" value="' . $term->slug . '"' . (($_GET['tag'] ==  $term->slug)?'checked':"") . '> ' . $term->name;
                endforeach;
            endif;
        ?>
    </div>
    <input type="text" name="tag" value=""> نوع
    <input type="submit" id="searchsubmit" value="<?php esc_attr_e( 'Search', 'aldoustech' ); ?>">
</form>

我自己编写了代码，我已经通过使用 javascript 将选中的复选框添加到另一个文本字段然后通过表单发送带有它的数据的文本字段来解决问题。

如何修复 Wordpress 中表单提交的重复？

How to fix the duplicate of the form submission in Wordpress?

forms

wordpress

form-submit