Execute Page process with Ajax callback

Your ads will be inserted here by

Easy Plugin for AdSense.

Please go to the plugin admin page to
Paste your ad code OR
Suppress this ad slot.

Sometimes you want to call a page-proces, but do need to make a compleet refresh of the page by making a request.

In my case I made a simple master-detail screen with Tabs (Thank you Richard). In the tabs there are reports with a delete button for each row. For the delete operation I did not want refresh the complete page, but only wanted to call the page-proces I had written for the delete-operation and only wanted to refresh the report-region affected.

This is wat i did:

  • I made a normal report and added an icon for the delete operation. The icon for the delete operation is the id-column in the report (PRODUCT_VERWIJZING_ID) and has the follwoing column link properties:
    • link text: <img src=”#IMAGE_PREFIX#del.gif” alt=””>
    • target: URL
    • URL: javascript:del_verwijzing(#PRODUCT_VERWIJZING_ID#)

By putting this code in the URL the javascript function “del_verwijzing” will be executed when the user clicks on the delete icon. The function has the id as input parameter.

  • I made a hidden page-item P1_VERW_PRODUCT_VERWIJZING which will be used for the delete operation
  • In the Region footer of the report i placed some javascript which calls the pages-proces and refreshes the report:
<script language="Javascript" type="text/javascript">
    function del_verwijzing(ProductVerwijzingId)
    {
		var get = new htmldb_Get(null,&APP_ID., 'APPLICATION_PROCESS=DEL_PRODUCT_VERWIJZING',&APP_PAGE_ID.);
		get.add('P1_VERW_PRODUCT_VERWIJZING',ProductVerwijzingId);
		var gReturn = get.get();
		alert(gReturn);
		$a_report('#REGION_ID#'.substring(1), 1, 7, 7);
    }
</script>

Your ads will be inserted here by

Easy Plugin for AdSense.

Please go to the plugin admin page to
Paste your ad code OR
Suppress this ad slot.

var get = new htmldb_Get(null,&APP_ID., ‘APPLICATION_PROCESS=DEL_PRODUCT_VERWIJZING’,&APP_PAGE_ID.); -> Specifies the name of the proces to be executed

get.add(‘P1_VERW_PRODUCT_VERWIJZING’,ProductVerwijzingId); -> Adds the value of the id-column (=input parameter)  to the hidden field P1_VERW_PRODUCT_VERWIJZING. This field will be read by the page-process

var gReturn = get.get(); -> executes the ajax call to the page process

alert(gReturn); -> shows the return value of the page proces in a message box

$a_report(‘#REGION_ID#’.substring(1), 1, 7, 7); -> refrehes the region with a second ajax-call

  • Next i made a page-proces named DEL_PRODUCT_VERWIJZING (process point = on demad) with following source:
begin
  if   	:P1_VERW_PRODUCT_VERWIJZING is not null
  then
      delete from ama_product_verwijzingen c
      where  product_verwijzing_id =  :P1_VERW_PRODUCT_VERWIJZING;

       	:P1_VERW_PRODUCT_VERWIJZING := '';
  end if;
  commit;

  htp.p('Verwijzing succesvol verwijderd.');
end;

htp.prn(‘Verwijzing succesvol verwijderd.’); -> is used as the return value of the page process en will shown in the message-box

6 thoughts on “Execute Page process with Ajax callback”

  • Very good tut! Thanks!Trying it I found a mistake: $( a[href=’ + delHref + ‘] ) was tanereging an exception (using FF4, jquery 1.5.1) and preventing it to deleting the tr in the table. $( ‘a[href=’ + delHref + ‘]’ ).parents( ‘tr’ ) .fadeOut( ‘slow’, function() { $( this ).remove(); }); that was because the lack of , so that line should be changed to $( ‘a[href=”‘ + delHref + ‘”]’ ).parents( ‘tr’ ) .fadeOut( ‘slow’, function() { $( this ).remove(); });

  • Thank you very much for the sample. It made me find a way of calling a process to update an anychart with an xml customized

  • I tried ajax callback in same way but rather than alert I used apex_application.g_print_success_message but its not firing please let me know how to display apex default sucess messge(Inline with notification) using ajax call back.

Leave a Reply