lundi 26 septembre 2016

How to Call a Shown Event w/ Dynamic Bootstrap Modal ID

How do you call a 'Shown Event' .on('shown.bs.modal') in JQuery when you have a Dynamic Bootstrap Modal ID created with Laravel? I'm not sure of the proper syntax to have reflected within the $('#addressModal') portion of JQuery.

JQUERY:

$('#addressModal').on('shown.bs.modal', function (event) { 
    code something here 
})

VIEW (BLADE): Button

@foreach ($tasks as $task)
  <tr>
    <td>
        <button type="button" class="btn btn-default btn-sm btn-block" data-toggle="modal" data-address="" data-city="" data-target="#addressModal" data-target2=""> - </button>
    </td>
  </tr>
@endforeach

Modal

@foreach ($tasks as $task)
    <div class="modal fade" id="addressModal" tabindex="-1" role="dialog" aria-labelledby="addressModalLabel">
      <div class="modal-dialog" role="document">
         <div class="modal-content">
            <div class="modal-header">
               <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
               <h4 class="modal-title" id="addressModalLabel">Report</h4>
            </div><!-- /.modal-header -->
            <div class="modal-body">
               <p> - </p>
               <div class="panel-body">
                  <div id="addressModalContainer">
                     <canvas id="myChart" width="200" height="100"></canvas>
                  </div>
               </div>
            </div><!-- /.modal-body -->
            <div class="modal-footer">
               <button type="button" class="btn btn-default" data-dismiss="modal" id="addressModalClose">Close</button>
            </div><!-- /.modal-footer -->
          </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
      </div><!-- /.modal -->
@endforeach



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire