Установите раскрывающийся список для активного или не использующего макет

Ответов: 0

Установите раскрывающийся список для активного или не использующего макет

Я использую Symfony framework 3, поэтому я использую ветку для рендеринга моей страницы, и я использую «общий» макет с именем layout.html.twig:

<!DOCTYPE HTML>
<html>
    <head>
        {% block head %}
            <meta charset='utf-8'>
            <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
            <meta http-equiv="x-ua-compatible" content="ie=edge">
            <title>{% block title %} AcreatMailing {% endblock title %}</title>
            {% block js_head %}
                <script type="text/javascript" src="{{ asset('/bundles/front/components/MDBootstrap/js/jquery-3.1.1.min.js') }}"></script>
            {% endblock js_head %}
            {% block stylesheet %}
                <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css">
                <link href="{{ asset('/bundles/front/css/style.min.css') }}" rel="stylesheet" />
            {% endblock stylesheet %}
        {% endblock head %}
    </head>
    <body>
        <div id="body">
            <div class="header">
                <div class="row">
                    <div class="col-1 col-sm-1">
                        <button class="hamburger">&#9776;</button>
                    </div>
                    <!--<div class="col-1 col-sm-1 col-lg-1 offset-lg-2" id="spanSearch">
                        <h4><span class="badge indigo hide">{# block badge_research %}{% endblock #}</span></h4>
                    </div>
                    <div class="col-2 offset-2 col-sm-2 offset-sm-3 col-md-2 offset-md-3 col-lg-2 offset-lg-3">
                        <div class="search d-inline pull-right">
                            <a href="#" onclick="showAndHide()" id='icon' ><i class="fa fa-search fa-2x" aria-hidden="true"></i></a>
                            <form class="form-inline waves-effect waves-light" id="form">
                                <input class="form-control tags" id="search" type="text" placeholder="Search" onkeydown="keyDown()">
                            </form>
                        </div>
                    </div>
                    !-->
                    <div class="col-7 col-sm-6 col-md-6 col-lg-6 offset-lg-5">
                        <ul class="list-inline pull-right downMenu inline">
                            <li class="nav-item dropdown btn-group">
                                <a class="nav-link" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="false"> {% if is_granted("IS_AUTHENTICATED_REMEMBERED") %} <img src="{{ asset('/Image/contact.png') }}" class="img-circle" width="50" height="50"> {% else %} {{ 'acreat.mailing.nav.account'|trans }} {% endif %}</a>
                                <div class="dropdown-menu top dropdown" no-escape aria-labelledby="dropdownMenu1">
                                    <div class="card">
                                        <div class="card-block">
                                            <div class="container-fuild">
                                                <div class="row">
                                                    <div class="col-3">
                                                        <img src="{{ asset('/Image/contact.png') }}" class="img-circle" width="200" height="112">
                                                    </div>
                                                    <div class="col-9">
                                                        {% if is_granted("IS_AUTHENTICATED_REMEMBERED") %}
                                                            <a href="{{ path('fos_user_profile_show') }}" class="dropdown-item">{{ 'acreat.mailing.nav.myaccount'|trans }}</a>
                                                            <a href="{{ path('fos_user_change_password') }}" class="dropdown-item">{{ 'acreat.mailing.nav.changepassword'|trans }}</a>
                                                            {% if is_granted('ROLE_PREVIOUS_ADMIN') %}
                                                                <a href="{{ path('front_index', {'account': '_exit'}) }}" class="dropdown-item">{{'acreat.mailing.admin.impersonalisation'|trans}}</a>
                                                            {% endif %}
                                                    </div>
                                                </div>
                                                    <div class="card-footer text-center">
                                                        <a href="{{ path('fos_user_security_logout') }}" class="btn btn-block acreatRed dropdown-item">{{ 'acreat.mailing.nav.logout'|trans }}</a>
                                                        {% else %}
                                                        <a href="{{ path('fos_user_security_login') }}" class="btn btn-block acreatRed dropdown-item">{{ 'acreat.mailing.nav.login'|trans }}</a>
                                                    </div>
                                                {% endif %}
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </ul>
                        <div class="search d-inline inline pull-right">
                            <a href="#" onclick="showAndHide()" id='icon' ><i class="fa fa-search fa-2x" aria-hidden="true"></i></a>
                            <form class="form-inline waves-effect waves-light" id="form">
                                <input class="form-control tags inline" id="search" type="text" placeholder="Search" onkeydown="keyDown()">
                            </form>
                        </div>
                        <div class="inline pull-right spanSearch">
                            <h5>{% block badge_research %}{% endblock %}</h5>
                        </div>
                    </div>
                </div>
            </div>
            {% if is_granted("IS_AUTHENTICATED_REMEMBERED") %}
                {% block navbar %}
                    <div class="sidebar blue-grey darken-4 no-escape" id="navbar">
                        <div class="user-box no-escape">
                            <a class="logo no-escape" href="/" title="Retour a l'accueil">
                                <img src ="https://www.acreat.com/sites/acreat.com/themes/acreat/images/logo.png" class="img-fluid text-center no-escape"></img>
                            </a>
                            <h5 class="text-center">{{ 'acreat.mailing.title.website'|trans }}</h5>
                        </div>
                        <div class="list-group panel no-escape" aria-expanded="true">
                            <a href="/" id="dashboard" class="list-group-item no-escape" data-parent="#sidebar" aria-expanded="false"><i class="fa fa-dashboard margin-right"></i> <span>{{ 'acreat.mailing.nav.dashboard'|trans }}</span> </a>
                            <a href="#menu0" class="list-group-item no-escape arrowContainer" data-toggle="collapse" data-parent="#sidebar" aria-expanded="true"><i class="fa fa-tasks margin-right"></i><span>{{ 'acreat.mailing.nav.inbox'|trans }}<i class="fa fa-angle-down" id="wrapperArrow"></i></span></a>
                            <div class="collapse show no-escape" id="menu0">
                                <a href="/message/template/{{app.user.id}}" class="list-group-item no-escape" id="addmessage" data-parent="#sidebar" aria-expanded="true">
                                    <span>{{ 'acreat.mailing.nav.addmessage'|trans }}</span>
                                </a>
                                {%- set numberNotSent = doctrine.createQueryBuilder().select('COUNT(u.id)').from('CoreBundle:Message', 'u').where("u.status !='COMPLETED'")
                                .andWhere("u.account = " ~ app.user.id).andWhere("u.status !='SUBMITTED'").getQuery().getResult() -%}
                                <a href="/message/viewNotSent" class="list-group-item no-escape" data-parent="#sidebar" id="viewNotSent" aria-expanded="true">
                                    <span class="fixed-witdh">{{ 'acreat.mailing.nav.messagenotsent'|trans }}</span>
                                    <span class="badge badge-primary badge-pill">{{ numberNotSent[0][1] }}</span>
                                </a>
                                {%- set numberSent = doctrine.createQueryBuilder().select('COUNT(u.id)').from('CoreBundle:Message', 'u').where("u.status ='COMPLETED'")
                                .andWhere("u.account = " ~ app.user.id).getQuery().getResult() -%}
                                <a href="/message/viewSent" class="list-group-item no-escape" id="viewSent" data-parent="#sidebar" aria-expanded="true">
                                    <span class="fixed-witdh">{{ 'acreat.mailing.nav.messagesent'|trans }}</span>
                                    <span class="badge badge-primary badge-pill">{{ numberSent[0][1] }}</span>
                                </a>
                                <a href="/message/viewDraft" class="list-group-item no-escape" id="draft" data-parent="#sidebar" aria-expanded="true">
                                    <span>{{ 'acreat.mailing.nav.draft'|trans }}</span>
                                </a>
                            </div>
                            <a href="/mailinglist/view" class="list-group-item no-escape" id="listview" data-parent="#sidebar" aria-expanded="false"><i class="fa fa-list margin-right"></i> <span>{{ 'acreat.mailing.nav.mailinglist'|trans }}</span> </a>
                            <a href="/member/view" class="list-group-item no-escape" id="memberview" data-parent="#sidebar" aria-expanded="false" ><i class="fa fa-users margin-right"></i> <span>{{ 'acreat.mailing.nav.member'|trans }}</span></a>
                            {%- if is_granted('ROLE_ADMIN') -%}
                                <div id="adminBottom" class="no-escape">
                                    <a href="#menu4" class="list-group-item no-escape bottom arrowContainer2" data-toggle="collapse" data-parent="#sidebar" aria-expanded="true"><i class="fa fa-envelope margin-right"></i> <span >{{ 'acreat.mailing.nav.administration'|trans }}<i class="fa fa-angle-down" id="wrapperArrow2"></i></span></a>
                                    <div class="collapse show no-escape" id="menu4">
                                        <a href="/admin/mailinglist" class="list-group-item no-escape" id="adminlist" data-parent="#menu4">{{ 'acreat.mailing.nav.administrationlist'|trans }}</a>
                                        <a href="/admin/account/view" class="list-group-item no-escape" id='adminaccount' data-parent="#menu4">{{ 'acreat.mailing.nav.administrationaccount'|trans }}</a>
                                        <a href="/admin/message" class="list-group-item no-escape" id="adminmessage" data-parent="#menu4">{{ 'acreat.mailing.nav.administrationnewsletter'|trans }}</a>
                                        <a href="/admin/parameters" class="list-group-item no-escape" id="adminparameters" data-parent="#menu4">{{ 'acreat.mailing.nav.administrationparameters'|trans }}</a>
                                    </div>
                                </div>
                            {%- endif -%}
                        </div>
                    </div>
                {% endblock navbar %}
            {%- endif -%}
            <div id="content">
                {% block body %}
                        {%- if app.user == false -%}
                            <main class="col-12 col-md-12 col-xs-12 col-lg-12 col-xl-12">
                        {%- else -%}
                            <main class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 ">
                        {%- endif -%}
                            {% block flashmessage %}
                                {% for flashMessage in app.session.flashbag.get('notice') %}
                                    <div class="alert alert-success" role="alert">
                                        {{ flashMessage }}
                                    </div>
                                {% endfor %}
                                {% for flashMessage in app.session.flashbag.get('fail') %}
                                    <div class="alert alert-danger" role="alert">
                                        {{ flashMessage }}
                                    </div>
                                {% endfor %}
                                {% for flashMessage in app.session.flashbag.get('success') %}
                                    <div class="alert alert-success" role="alert">
                                        {{ flashMessage }}
                                    </div>
                                {% endfor %}
                            {% endblock flashmessage %}
                            {% block main %}
                                {%- block breadcrumb -%}{%- endblock -%}
                                <section></section>
                                {%- block confirmation -%}{%- endblock -%}
                            {% endblock main %}
                            {% block fos_user_content %}
                            {% endblock fos_user_content%}
                        </main>
                {% endblock body %}
            </div>
        </div>
    </body>
{% block footer %}
    {% block footer_javascript %}
        <script src="{{ asset('bundles/fosjsrouting/js/router.js') }}"></script>
        <script src="{{ path('fos_js_routing_js', { callback: 'fos.Router.setData' }) }}"></script>
        <!-- Bootstrap tooltips -->
        <script type="text/javascript" src="{{ asset('/bundles/front/components/MDBootstrap/js/tether.min.js') }}"></script>
        <script type="text/javascript" src="{{asset('bundles/front/components/moment/min/moment.min.js') }}"></script>
        <!-- Bootstrap core JavaScript -->
        <script type="text/javascript" src="{{ asset('/bundles/front/components/MDBootstrap/js/bootstrap.min.js') }}"></script>
        <!-- MDB core JavaScript -->
        <script type="text/javascript" src="{{ asset('/bundles/front/components/MDBootstrap/js/mdb.min.js') }}"></script>

        <script type="text/javascript" src="{{ asset('/bundles/front/components/jquery-ui/jquery-ui.min.js') }}"></script>

        <script type="text/javascript" src="{{ asset('/bundles/front/js/libraries.min.js') }}"></script>
        <script type="text/javascript" src="{{ asset('/bundles/front/js/acreatmailingfront.min.js') }}"></script>
    {% endblock footer_javascript %}
{% endblock footer %}
</html>

И я хотел бы знать, есть ли какое-нибудь решение более простое, если использовать твист, если тег похож:

    <a href="#" class="...{% if menu1 is not defined %} collapsed {% endif %}>...</a>

Потому что я не могу установить его с помощью jQuery или javascript, когда пользователь решил показать или скрыть это меню, потому что мой макет регенерируется при перезагрузке моей страницы или при изменении моей страницы ...

Если у кого-нибудь есть идея, дайте мне знать!

[РЕДАКТИРОВАТЬ] Более ясный вопрос: как я могу изменить класс моего предмета в соответствии с comportement пользователя, если он нажал, чтобы отбросить меню, а затем отпустите меню до тех пор, пока он щелкнул в другое время

Заранее спасибо !

00JavaScript, JQuery, Symfony, выпадающее меню, веточка,
Похожие вопросы