APEX 18.1: Fix Interactive Grid JS error in translated apps

Recently one of our clients upgraded APEX from 5.1 to 18.1 and all Interactive Grid regions/pages were instantly "broken". There was some strange JS error ("...to few arguments") in the console window.

After some investigation I found out the cause of the error. It's actually reported as a known issue (28202781 - INTERACTIVE GRID IN TRANSLATED APP GIVES ERROR ON UPGRADE). Apparently the text string APEX.IG.SUMMARY was changed in APEX 18.1 to have fewer parameters and if you have translated application it will raise a JS error at runtime. I don't know why APEX raises error in this case and I hope that this will be fixed in some next release, but for now here's the way how you can fix this.

Of course, you can go to APEX builder > Shared Components > Text Messages and translate it there with the new text message that will have exactly two parameters (if you have less than two you'll again get JS error). Original text is Interactive Grid. Report: %0, View: %1.

You can also do it with PL/SQL script:

BEGIN
  FOR i IN (SELECT workspace_id
              FROM apex_workspaces
             WHERE workspace = :WORKSPACE_NAME)
  LOOP          
    apex_util.set_security_group_id(i.workspace_id);
  END LOOP; 
  
  FOR i IN (SELECT *
              FROM apex_application_translations
             WHERE application_id = :APP_ID
               AND translatable_message = 'APEX.IG.SUMMARY')
  LOOP
    apex_lang.update_message(
          p_id           => i.translation_entry_id,
          p_message_text => 'Interactive Grid. Report: %0, View: %1');
    COMMIT;
    EXIT;
  END LOOP;
END;
/

Tested with APEX 18.1.0.00.45

Enjoy!

APEX 5.1: Translate HTML5 Client-Side Validation Messages

You may know that in APEX 5.1 there are some new functionalities regarding client-side messaging - for example, the capability to display success or error messages without a full page reload or new JS API for handling client-side messages. There are also enabled HTML5 Form Validations, so you may saw something like this in your apps:

The problem that I had is that the user wanted to translate those messages to the other language (in my case Croatian). I thought - no problem. I'll find those messages in the APEX messages dictionary and translate them to the Croatian. After some exploring I found out that those messages are actually browser depended and you can't translate them (the only option is to install browser in different language).

Fortunately, the APEX development team has thought about this and you can override those messages by defining custom attribute named data-valid-message under the item's Custom Attributes property:

And now the form should look like this:

If you don't want to do this for each and every item in your app you can create On Load Dynamic Action on Global Page (page 0) that looks like this:

which will add this attribute to all required fields.

You can read more about the data-valid-message attribute in apex.item documentation.

Enjoy!

Tested on APEX 5.1.0.00.45

Dynamically changing item labels

Today I’ve got one idea how to simply change (in my example translate) item label dynamically with value from database using shortcuts.

First of all you have to create database table to store translated labels, associated to item name and language. For example:

  create table item_labels (
      item_name varchar2(255)
    , item_label varchar2(4000) 
    , lang varchar2(10));

After that you have to create function for fetching label for specific item and current language (that can be set in some application item):

  create or replace function get_item_label (p_item_name varchar2

                                           , p_lang      varchar2 default 'EN')

    return varchar2

  is

    v_item_label item_labels.item_label%type;

  begin

      select item_label

        into v_item_label

        from item_labels

       where upper(item_name) =  upper(p_item_name)

         and upper(lang)      = upper(p_lang);

     return v_item_label;

  exception

    when no_data_found then

      select pi.label

        into v_item_label

        from apex_application_page_items pi

       where pi.application_id = v('APP_ID')

         and pi.page_id = v('APP_PAGE_ID')

         and pi.item_name = p_item_name;

      return v_item_label;

  end get_item_label;

To dynamically change item label you have to modify definition of item label template to hide default label and to show one from database (using TRANSLATE_LABEL shortcut).

And the last step should be creation of shortcut (in my example named TRANSLATE_LABEL) that for source has PL/SQL function body that returns translated label:

At the end just add data to item_labels table and apply item label template. Don’t forget to create application item CURRENT_LANGUAGE that can be set dynamically.

@Kirsten:
For item label with help definition should look like this: