Press "Enter" to skip to content

Oracle Apex Validation Without Submit Using JavaScript and Ajax Callback

In my previous tutorial, I have given an example to validate a page item using the PL/SQL function returning error text. Which executes on page submit, but if you want to warn the user for an error without the page submit, then you can use the Ajax Callback process and call it using the JavaScript. Below is an example:

Create an Ajax Callback Process on the Page

To do this, I have created an Ajax Callback process validate_rollno_ajx on that page with the same code I have written for the validation on item p11_roll_no. But with a minor change, I have replaced the return command with the htp.prn and added an extra else condition to return the string 'SUCCESS'.

Begin
    If substr(:p11_roll_no, 1, 1) != 'S' Then
        htp.prn('Roll number must start with S.');
    Elsif length(:p11_roll_no) < 7 Then
        htp.prn('Roll number must be 7 character long.');
    Else
        htp.prn('SUCCESS');
    End If;
End;

The following is the screenshot for your reference:

Ajax Callback process settings.

Create a Dynamic Action to Execute JavaScript Code

Then I have created a dynamic action on the item p11_roll_no on the event Lost Focus to execute the JavaScript code to call the above Ajax Callback process validate_rollno_ajx. Below is the example:

apex.server.process('validate_rollno_ajx',
{
   pageItems : '#P11_ROLL_NO'
}
,
{
   dataType : 'text', success : function(data)
   {
      if(data != 'SUCCESS') apex.message.alert(data);
   }
}
)

The following is the screenshot for the above settings:

Dynamic action execute JavaScript Code settings.

Now whenever the user will navigate through the page item p11_roll_no, it will execute the above JavaScript code and will show the alert message if the roll number is not valid as per the conditions applied in the Ajax Callback process.

Oracle Apex: calling Ajax Callback process using JavaScript.

Have you found the answer to your question? If not, you can discuss it with me in the comments section below or join my Q&A community OrclQA.com for developers and ask your question. It is FREE.

Vinish Kapoor

Follow

Hi, I am a full stack developer and writing about development. I document everything I learn and help thousands of people. foxinfotech.in is created, written, and maintained by me; it is built on WordPress, and hosted by Bluehost. Connect with me on Facebook, Twitter, GitHub, and get notifications for new posts.

guest
12 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
MAHENDRA
MAHENDRA
2 months ago

on Invalid data entry, after displaying error message cursor return to next item.
Cursor shuold be on Invalid Page item not goto Next Item.

MAHENDRA
MAHENDRA
Reply to  Vinish Kapoor
2 months ago

First I tried below line in EXECUTE JAVASCRIPT CODE

srno 1-->  if(data != 'SUCCESS') apex.message.alert(data);
this working FINE

but when added below line in
Function and global variable for page.

function showError(pData) {
    apex.message.alert(pData);
    apex.item( "P49_DEPTNAME" ).setFocus();
}
and
srno 1 line replaced with below line

if(data != 'SUCCESS') showError(data);
no error message display and cursor not return to p49_deptname
Thanks
Mahendra
MAHENDRA
MAHENDRA
Reply to  Vinish Kapoor
2 months ago

I TRIED WHAT YOU ASKED TO DO IT BUT PAGE GOING HANGED AFTER DISPLAYED ERROR MESSAGE

MAHENDRA
MAHENDRA
2 months ago
HI VINISH

Thanks for valuable reply and that ok but

when I entered Invalid entry that time I got error message 
1) at screen top right 
      2 errors have occured 
         a) Invalid Country  -- I am validing on COUNTRY
         b) an error has occured
2) inline error -- invalid country

when I entered valid entry cursor moved to next page item but Error message
not disappeared from sreen.

so I used 

     apex.message.clearErrors();

in Execute Javascript code at top of your code

Now working Fine.

Thanks

Mahendra

   
WDNV
WDNV
1 month ago

Excelent post.
I replaced the LOST FOCUS DA with a button and it worked perfect with static text, but for some reason the AJAX CALLBACK process is not getting any values from the from, I mean :PXX_ITEM_NAME is allways null for any item.
Any idea how to send values to the callback?

WDNV
WDNV
Reply to  Vinish Kapoor
1 month ago

Excelent!!!!!
Thank you so much.