How to add screen in your favourite list (Last Part)

In the first two part, we explored how to quickly add screens to our Favorite List for faster navigation. Now, in last part, we’ll dive deeper and extend the functionality making it even smarter and more user-friendly. This continuation will help you maximize productivity while managing complex applications with thousands of menus. If you not explore the first two then please follow it first from here (Part 1) and part 2.

You can follow below tutorials for better understanding. 

Last Part, Part 2 and Part 1 from here.

Let's walk through the implementation process of last part step by step-

Step- 1:

Open your application builder home page. Click on shared component icon and then click on "Application process" link under the "Application Logic" section. From the application process list select the "SET_BOOKMARK" process. Click on the source tab or scroll below up to "Source > code". Modify the source code. Here, we will be going to remove the screen from the favorite list if it is already added. Replace the below code portion in your process's source code-

 

DECLARE

    l_bookmark_id   NUMBER;

    l_msg           VARCHAR2(300);

    l_count         NUMBER ; 

BEGIN

    SELECT NVL(MAX(bookmark_id),0)+1

    INTO l_bookmark_id

    FROM bookmark;

    IF bkmrk_max_limit(

        p_userid  => apex_application.g_x02

    ) > 0 THEN

        -- CHECK FIRST IF THE PAGE IS ALREADY ADDED OR NOT

        SELECT COUNT(*)

        INTO l_count

        FROM bookmark

        WHERE page_id = apex_application.g_x01

        AND user_id   = apex_application.g_x02;

        IF l_count > 0 THEN

           --l_msg := 'Already added to bookmark.';

            DELETE FROM bookmark

            WHERE page_id = apex_application.g_x01 

            AND user_id   = apex_application.g_x02 ;

            l_msg := 'Successfully remove from bookmark.';

        ELSE

            INSERT INTO bookmark(bookmark_id, page_id, user_id)

            VALUES(l_bookmark_id, apex_application.g_x01, apex_application.g_x02);

            l_msg   := 'Successfully added to bookmark' ;

        END IF;

    ELSE

        l_msg   := 'You have reached your max limit. Please remove one first.';

    END IF;

        apex_json.open_array;

        apex_json.open_object;

        apex_json.write('MSG', l_msg);

        apex_json.close_object;

        apex_json.close_all;

END;

Compile the code and click on Apply Changes button.

Step- 2:

Open page 0 and select the region named "JS 2". Navigate to the properties section and open then "Header Text" code editor under the "Header and Footer" sub-section. Modify the JavaScript function named "isAddedToBookmark()". Replace the below function (Newly added portion of code marked as bold)-

 

function isAddedToBookmark() {

        var userId = apex.item('P0_USER_ID').getValue();

        var pageId = $v('pFlowStepId');

        apex.server.process(

            'CHECK_BOOKMARK_ADDED' ,

            {

                x01: userId,

                x02: pageId

            } ,

            {

                dataType: 'json',

                success: function(pData) {

                    var bkmrk = document.getElementById('bookmark');

                    if (pData[0].ADDED === 'Y') {

                        bkmrk.innerHTML = '★ Remove Bookmark';

                        bkmrk.style.backgroundColor = 'red';

                        bkmrk.style.color = '#fff'

                    } else {

                        bkmrk.innerHTML = '★ Add to Bookmark';

                        bkmrk.style.backgroundColor = '#ccc';

                        bkmrk.style.color = 'black' 

                    }

                }

            }

        )

    }

Click "OK" and save the page. Run the application and enjoy. That's all for adding screen/page to favorite list.