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:

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:

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.