How to call JavaScript function defined in Flex-iFrame html from flex page?

In my flex application, I'm having a flex-iframe in which I'm loading a HTMLfile. I have to call a javascript function defined in loaded HTML file.

I'm making use of callIFrameFunction('jsfunctionname'). I'm using flex-iframe-1.4.6.swc & flex 4.1 SDK.

But, the javascript function is not invoked anyhow and it is not executed. I have placed the html file in the same directory where the mxml file resides.

I have embedded the code below. Kindly, if you got some ideas, please share your views.

<flexiframe:IFrame id="iFrameWithJSfunctions"
   label="Map"
   source="pageWithJSfunctions.html"
   frameLoad="callShowAlert(event)"
   width="400"
   height="120"
   overlayDetection="true" />

/**
  * Call the 'showAlert()' JavaScript method.
  */
  private function callShowAlert(event:Event):void
  {
  iFrameWithJSfunctions.callIFrameFunction('showAlert');
  }

Where showAlert is a js function defined in pageWithJSfunctions.html file.