联系官方销售客服

1835022288

028-61286886

求助 版主:官方研发技术组
列表实现select下拉多选筛选功能呢
类型:迅睿CMS 更新时间:2022-08-02 11:22:34

微信截图_20220802095311

官网这个筛选复选字段 能不能改成 select 下拉多选完之后再加个搜索按钮呢,有大神指导下么。。

回帖
  • 优速开发工作室
    #1楼    优速开发工作室
    2022-08-02 10:02:29
    Chrome 0
    道理都一样,只是改变了一种模板展示方式,用js就可以搞定了,可以加我QQ做
  • 小黄人 18html
    #2楼    小黄人 18html
    2022-08-02 10:03:11
    Chrome 0
    百度找对应的样式就可以实现了
  • 小黄人 18html
    #3楼    小黄人 18html
    2022-08-02 11:22:34
    Chrome 0
    官方默认模板改造
                                    <form action="/index.php" method="get">
                                        <input type="hidden" name="s" value="demo">
                                        <input type="hidden" name="c" value="search">
                                        <input type="text" placeholder="搜索内容..." name="keyword">
                                        <div class="form-group row" id="duoxuan">
                                            <label class="col-md-2 control-label">复选字段-多条件</label>
                                            <div class="col-md-9">
                                                <label>
                                                    <a class="label {if !$params.fuxuankuang}label-success{else}label-default{/if}" href="{Router::search_url($params, 'fuxuankuang', NULL)}">不限</a>
                                                </label>
                                                <!--调用单选字段数据方法-->
                                                {php $field = dr_field_options($ci->module['field']['fuxuankuang']['id']);}
                                                {loop $field $value $name}
                                                <label>
                                                    <span class="label {if dr_is_double_search($params.fuxuankuang, $value)}label-success{else}label-default{/if}" data-value="{$value}">{$name}</span>
                                                </label>
                                                {/loop}
                                            </div>
                                        </div>
                                        <input id="duoxuan_value" name="fuxuankuang" value="{$params.fuxuankuang}" type="hidden">
                                        <script type="text/javascript">
                                        $('#duoxuan span').on('click', function() {
                                            var val = $(this).data('value');
    
                                            //点击,添加样式
                                            if ($('#duoxuan a').hasClass('label-success')) {
                                                $('#duoxuan a').removeClass("label-success").addClass("label-default");
                                            }
                                            if ($(this).hasClass('label-success')) {
                                                $(this).removeClass("label-success").addClass("label-default");
                                            } else {
                                                $(this).removeClass("label-default").addClass("label-success");
                                            }
                                            //点击,添加样式
    
                                            //历遍,组合多选值
                                            var id = [];
                                            $("#duoxuan span").each(function() {
                                                if ($(this).hasClass('label-success')) {
                                                    id.push($(this).data('value'));
                                                }
                                                var Newstr = id.join("|");
                                                $('#duoxuan_value').val(Newstr);
                                            });
                                            //历遍,组合多选值
    
                                        })
                                        </script>
                                        <input type="submit" value="提交搜索" />
                                    </form>