TUniURLFrame client event 'frameload' firing when form loads

[SantoshGnostice]

Hi

 

I have a form with a frame inside which is initially empty and at a later point I set a URL to the frame to load a page. I need some JS to be run after the frame has loaded the page. For this I have setup a handler under ClientEvents -> ExtEvents -> frameload as shown below:

function frameload(sender, frame, eOpts)
{
   alert('Viewer loaded!');
} 

However I am finding that this event is fired twice. Once when the application is loaded. And again later when I set a URL to the frame and the frame is done loading the page. The second firing is fine but I don't understand why it's firing the first time when nothing is loaded in the frame.

 

Apprecitiate the help!

[SantoshGnostice]

This appears like a bug to me. How do I raise a bug report about this? I don't have permissions to create a new topic in the bug reports forum.

[mhmda]

Will it is not easy as you think to fire event after page totally loaded. because the page might contain files like: css,js,images.... and this occur asynchronously and depends on connection speed.

[SantoshGnostice]

@mohammad my situation is a bit different. Let me try to explain with a simple example. I have a main form on which I have a button and a TUniURLFrame (which is basically an iframe element in HTML). When the user clicks the button I load another website inside the TUniURLFrame. I want to be notified when the iframe has finished loading the external website. For this I am trying to use the TUniURLFrame's ClientEvents -> ExtEvents -> frameload event which should fire after the external website is done loading completely inside the iframe. There is no other way for me to find out the completion of the load. This all works fine except for the issue where when my application main form is loaded the TUniURLFrame's frameload event is being fired though there is nothing for it to load (it's URL property is empty when the app starts).

[Sherzod]

Hi,

 

If I understand you correctly, you can try to use OnFrameLoaded event on the server side instead of "function frameload",

for example:

procedure TMainForm.UniURLFrame1FrameLoaded(Sender: TObject);
begin
  if (Sender as TUniURLFrame).URL<>'' then
    // your code
 
end;

Best regards,

[mhmda]

The best way is to use js and check for existing element 'id' I always use an element in the bottom of the page to be sure that the page is fully loaded.

[SantoshGnostice]

Hi,

 

If I understand you correctly, you can try to use OnFrameLoaded event on the server side instead of "function frameload",

for example:

procedure TMainForm.UniURLFrame1FrameLoaded(Sender: TObject);
begin
  if (Sender as TUniURLFrame).URL<>'' then
    // your code
 
end;

Best regards,

I need to run some JS in response to the frame load hence the reason for me to use the client-side event.

 

I seem to be getting answers suggesting workarounds which I appreciate but unfortunately those won't work for my need. I believe the errant behavior is due to a bug either in UniGUI or in Ext JS.

[Sherzod]

Ok, we will check this

 

I need to run some JS in response to the frame load hence the reason for me to use the client-side event.

procedure TMainForm.UniURLFrame1FrameLoaded(Sender: TObject);
begin
  if (Sender as TUniURLFrame).URL<>'' then
    UniSession.AddJS('alert("Viewer loaded!")'); 
 
end;

[SantoshGnostice]

Thank you! 

[SantoshGnostice]

BTW your suggestion and code prompted me to do a workaround for this. Now I am checking the iframe's "src" attribute and ignoring the first event.

function frameload(sender, frame, eOpts)
{
   // For some unknown reason (bug?) this event is called when the parent form loads and
   // the frame is still empty. So ignore it if the src is blank.
   var frameDivId = MainForm.UniURLFrame1.id;
   var frame = $('#' + frameDivId + ' iframe');
   var src = frame.attr('src');
   if (src === 'about:blank') {
      return;
   }

   // ...
}

[Farshad Mohajeri]

It is not a bug. This event fires when frame is loaded whether it is empty or not. An empty frame is not actually empty. It is contains a blank URL.

[SantoshGnostice]

Farshad, this is unexpected since in regular HTML/JS the iframe's src attribute is not set by default and hence the "load" event does not fire when the page is loaded with an empty frame. Perhaps Ext JS is setting the frame's src attribute to 'about:blank'?

[Farshad Mohajeri]

We explicitly set it to "about:blank" to initialize the frame.

[cvefa]

On 10/12/2017 at 1:06 PM, mhmda said:

The best way is to use js and check for existing element 'id' I always use an element in the bottom of the page to be sure that the page is fully loaded.

How can i get element by id inside in iframe ( iframe URL has a different domain ). Thanks