Laravel - PHP - Unable to toggle two forms in a single view

Herewith I have a single view 'dashboard.blade.php'. It's having multiple forms. I have set 'data-toggle='collapse' in '' is work properly for a single form with 'keyboard_arrow_down'. When click on that 'arrow' again first form will hide from the view. But I click on second'' when first form is already opened, both forms are displaying simultaneously. Now I need to manage this to display one form at a time and hide another form by clicking on next form.

Below is my code.

dashboard.blade.php

// first form -----------------------------------------

            <div class="panel"> 
              <div class="panel-heading" role="tab" id="headingTwo">
                <h4 class="panel-title"> 
                  <a  data-toggle="collapse" data-parent="#accordion3" href="#collapseTwo3" aria-expanded="false" aria-controls="collapseTwo3"  data-expandable="false"><i class="material-icons pmd-sm pmd-accordion-icon-left">toys</i>Brands <i class="material-icons md-dark pmd-sm pmd-accordion-arrow">keyboard_arrow_down</i></a> 
                </h4>
              </div>
              <div id="collapseTwo3" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
                <div class="panel-body">
                  <form class="form-horizontal" method="post" enctype="multipart/form-data"  action="">

              

              <div class="form-group files">
                 <label>Upload Your File</label>
                 <input type="file" name="import_file" />

              </div>

                 <div align="right">

                 <!-- <button class="btn btn-primary">Export</button> --> 
                 <button class="btn btn-primary">Import</button> 

                 </div>


                 </form>
                </div>
              </div>
            </div>

// second form --------------------------------------------------

            <div class="panel"> 
              <div class="panel-heading" role="tab" id="headingThree">
                <h4 class="panel-title">
                  <a  data-toggle="collapse" data-parent="#accordion3" href="#collapseThree3" aria-expanded="false" aria-controls="collapseThree3"  data-expandable="false"><i class="material-icons pmd-sm pmd-accordion-icon-left">category</i>Categories <i class="material-icons md-dark pmd-sm pmd-accordion-arrow">keyboard_arrow_down</i></a> 
                </h4>
              </div>
              <div id="collapseThree3" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
                <div class="panel-body">
              <form class="form-horizontal" method="post" enctype="multipart/form-data"  action="">

              

              <div class="form-group files">
                <label>Upload Your File</label>
                 <input type="file" name="import_file" />

              </div>

              <div align="right">

                <!-- <button class="btn btn-primary">Export</button> --> 
                <button class="btn btn-primary">Import</button> 

              </div>

               </form>
              </div>
              </div>
            </div>

quick answer is kindly appreciated.

via Chebli Mohamed