i try open modal. when user clicks on "read more", modal launched need set content dynamically using jquery. in debugger, looks click not fired, fields aren't set up...
links:
<a id="questionmodal-13" href="#modalfaq" data-toggle="modal" data-questiontitle="why this?" data-questionanswer="test answer 1"> read more</a> <a id="questionmodal-24" href="#modalfaq" data-toggle="modal" data-questiontitle="why that?" data-questionanswer="test answer 2"> read more</a> modal:
<div class="modal fade" id="modalfaq"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 id="questiontitle" class="modal-title">modal title</h4> </div> <div class="modal-body"> <p id="questionanswer" >here settings can configured...</p> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal"><?php echo _('close') ?></button> </div> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal --> jquery:
jquery('[id^=questionmodal-]').on('click',function(){ var question = $(this).data('questiontitle'); var answer = $(this).data('questionanswer'); $("#questiontitle").html( question ); $("#questionanswer").html( parsejson( answer ) ); }); the modal correctly launching nor field in modal. when place breakpoint in jquery on click, it's not firing...
i've tried form :
jquery('[id^=questionmodal-]').click(function(){ ... }); jquery , bootstrap libraries loaded...
some 1 can me please?
since bootstrap modal fires many events can handy use 1 of them instead of binding other events on target click.
if modal works, can sure events fired.
as documentation sates:
this event fires when show instance method called. if caused click, clicked element available relatedtarget property of event.
you can use event show.bs.modal in case that:
$('#modalfaq').on('show.bs.modal', function (e) { var question = $(e.relatedtarget).data('questiontitle'), answer = $(e.relatedtarget).data('questionanswer'); $("#questiontitle").html( question ); $("#questionanswer").html( answer ); }) 