1

Click on Popup append response data in the model popup.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>

<a data-toggle="modal" data-target="#mypopup" href="http://example.com/employees" class="btn btn-primary">popup</a>
<div class="modal fade com-modal" id="mypopup" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">

    </div>
  </div>
</div>
lalli
  • 17
  • 3
  • you want to pass data to popup ? check this https://stackoverflow.com/questions/10626885/passing-data-to-a-bootstrap-modal – Muhammad Usman Mar 21 '19 at 06:40
  • Possible duplicate of [Passing data to a bootstrap modal](https://stackoverflow.com/questions/10626885/passing-data-to-a-bootstrap-modal) – Shibon Mar 21 '19 at 06:44
  • Thank you for response @George Bailey. when I Click on Anchor to get response data from URL and represent that data into the model popup. – lalli Mar 21 '19 at 07:10

1 Answers1

1

Get it through jquery click event on the button

$(document).on("click", ".btn-primary", function (event) {
     event.preventDefault();
     var buttonUrl = $(this).attr('href');
    //to some any remote data you need to send an ajax request.
    $.ajax({
      url: buttonUrl,
      type: 'GET',
      dataType: 'html'
    })
    .always(function(responseData) {
      $("#mypopup .modal-content").html(responseData);
      $("#mypopup").show();
    });

});

Another way of access anchor tag data is to load the modal and then fetch it using relatedTarget using show.bs.modal event

$('#mypopup').on('show.bs.modal', function (e) {
      var anchorTag = e.relatedTarget; // reference to the element that trigger modal popup in your case anchar tag
      url = $(anchorTag).attr("href");
      $.ajax({
          url: url,
          type: 'GET',
          dataType: 'html'
      })
      .always(function(responseData) {
          $("#mypopup .modal-content").html(responseData);
      });
});
Abdul Manan
  • 2,255
  • 3
  • 27
  • 51