jqueryiframeloadjquery-callbackjquery-attributes

Callback to confirm that "SRC" attribute is set in IFRame


Need to show the popup only when the data is loaded inside IFrame successfully. Currently popup gets visible even if the source of IFrame doesn't get loaded. Here is the code snippet:

$('#myIframe').attr('src', 'Student.aspx?roll=' + rollNumber);
$('#studentInfoPopup').modal('show');

I tried with the following, but it didn't work:

$("#myIframe").load(function(){
      $('#studentInfoPopup').modal('show');
}).attr('src', 'Student.aspx?roll=' + rollNumber);

Kindly let me know the callback to confirm that "SRC" attribute is set in IFrame.


Solution

  • You should use jQuery as below::

    $('#myIframe').attr('src', 'Student.aspx?roll=' + rollNumber);
    $('#myIframe').load(function(){
      $('#studentInfoPopup').modal('show');
    });
    

    UPDATED:
    I have done this in JSFIDDLE, please check the link it will help you. and modify it as your need. Link: https://jsfiddle.net/a1kj8883/