Execute Page process with Ajax callback

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 gReturn = get.get();
		$a_report('#REGION_ID#'.substring(1), 1, 7, 7);

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:
  if   	:P1_VERW_PRODUCT_VERWIJZING is not null
      delete from ama_product_verwijzingen c
      where  product_verwijzing_id =  :P1_VERW_PRODUCT_VERWIJZING;

  end if;

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

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

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>