簡體   English   中英

引導手風琴在laravel中無法動態正常運行

[英]bootstrap accordian doesn't work properly dynamically in laravel

我有一個自舉式左手風琴導航代碼,如下所示(html,css,row),它工作正常。 基本上是類別和子類別。 但是,當嘗試使用php laravel使其動態時,它在設計中無法正常工作。 這意味着它會破壞CSS。

Templete代碼:

<div class="left-sidebar">
    <h2>Category</h2>
    <div class="panel-group category-products" id="accordian"><!--category-productsr-->
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4 class="panel-title">
                    <a data-toggle="collapse" data-parent="#accordian" href="#sportswear">
                        <span class="badge pull-right"><i class="fa fa-plus"></i></span>
                        Sportswear
                    </a>
                </h4>
            </div>
            <div id="sportswear" class="panel-collapse collapse">
                <div class="panel-body">
                    <ul>
                        <li><a href="">Nike </a></li>
                        <li><a href="">Under Armour </a></li>
                        <li><a href="">Adidas </a></li>
                        <li><a href="">Puma</a></li>
                        <li><a href="">ASICS </a></li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4 class="panel-title"><a href="#">Kids</a></h4>
            </div>
        </div>
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4 class="panel-title"><a href="#">Fashion</a></h4>
            </div>
        </div>
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4 class="panel-title"><a href="#">Households</a></h4>
            </div>
        </div>
    </div><!--/category-productsr-->

</div>

谷歌搜索和重新搜索之后,我幾乎了解了我的解決方案。 但是,現在我面臨的問題是-對於該具有子類別的類別,我有一個fa fa-plus圖標類。 它正確顯示了具有子類別的類別。 但是它顯示的時間與當前子類別的時間相同-如果一個類別具有兩個子類別,則顯示兩個+圖標;如果某個類別具有3/4/5子類別,則它們分別顯示3 + / 4 + / 5 +圖標而不是展示一個。 我該怎么辦?

這是使手風琴具有動態性的代碼:

<div class="left-sidebar">
    <h2>Category</h2>
    <div class="panel-group category-products" id="accordian"><!--category-productsr-->
        <?php
        $category = DB::table('tbl_category')
                ->where('publication_status', 1)
                ->get();

        $subcategory = DB::table('tbl_sub_category')
                ->where('publication_status', 1)
                ->get();
        ?>

        @foreach ($category as $v_cat)

        <div class="panel panel-default">
            <div class="panel-heading">
                <h4 class="panel-title">
                    <a data-toggle="collapse" data-parent="#accordian" href="#{{$v_cat->category_id}}">
                        <?php echo $v_cat->category_name; ?>
                        @foreach($subcategory as $sub)
                        @if ($sub->category_id === $v_cat->category_id)
                        <span class="{{ $v_cat->category_id  === $sub->category_id ? "badge pull-right" : '' }}"><i class="{{ $v_cat->category_id  === $sub->category_id ? 'fa fa-plus' : '' }}"></i></span>
                        @endif
                        @endforeach
                    </a>
                </h4>
            </div>
            <div id="{{$v_cat->category_id}}" class="panel-collapse collapse">
                <div class="panel-body">
                    <ul>
                        <li class="panel panel-title"><a href="{{URL::to('/flowers-category/'.$v_cat->category_name)}}">{{$v_cat->category_name}} Link </a></li>
                    </ul>
                    <span class="info info-sign"><i>Subcategory</i></span>
                    <ul>
                        @foreach($subcategory as $sub)
                        @if ($sub->category_id === $v_cat->category_id)
                        <li><a href="{{URL::to('/flowers-sub-category/'.$sub->sub_category_name)}}">{{$sub->sub_category_name}}</a></li>
                        @endif
                        @endforeach
                    </ul>
                </div>
            </div>
        </div>
        @endforeach
    </div><!--/category-productsr-->

注意:是否有任何檢查div的類的進程? 是否可以使用div類制作if語句。 即,if(div.class == something)做其他事情。 如果可能的話,我也許可以解決問題。

您不需要在那里循環子類別。 只需使用:

   @if ($subcategory->where('category_id', $v_cat->category_id)->first())
       <span class="badge pull-right"><i class="fa fa-plus"></i></span>
   @endif

此行檢查類別是否具有子類別。

   @if ($subcategory->where('category_id', $v_cat->category_id)->first())

如果您是Laravel的新手,我建議您熟練使用Checkout

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM