1 Reply Latest reply on May 1, 2013 4:01 PM by WannaRock

    Confirmation Dialog when clicking on Tree Node.

      I am working on Oracle Apex and I have the following problem:

      The code below shows the definition of a tree. The tree displays records from the table ACTIVITIES in hierarchical structure.

      When user clicks on a leaf/node of the tree he will be redirected to another page where the details of each Activity/leaf/node are displayed.

      The tree is part of a page where I have established a functionality to check for changes on the input fields of the page and inform the user when he tries to redirect without first saving the changes he made.

      What I want to do is:

      WHEN user clicks on a node of the tree AND he hasn't saved any changes he made
      trigger a confirmation dialog.

      he clicks OK he is redirected to the node details page as defined on the tree definition:

      ELSE if he clicks CANCEL

      he stays on the same page.

      The condition to trigger the confirmation box is:
      if (document.getElementById('P0_CHANGES_DETECTED').value == 1)

      where P0_CHANGES_DETECTED is a universal hidden text field that is set to +'1'+ every time a change is made.

      and here is the tree definition:

      select case when connect_by_isleaf = 1 then 0
      when level = 1             then 1
      else                           -1
      end as status,
      +"NAME" as title,+
      null as icon,
      +"ID" as value,+
      null as tooltip,
      decode(PARENT_ID,null,null, 'f?p=&APP_ID.:10:'||:APP_SESSION||'::::P10_ID:'||"ID") as link
      from "#OWNER#"."ACTIVITIES"
      where GROUP_ID = :P20_GROUP_ID
      start with "ID" in (select ID from "#OWNER#"."ACTIVITIES" where GROUP_ID = :P20_GROUP_ID and PARENT_ID is null)
      connect by prior "ID" = "PARENT_ID"
      order siblings by "ID"

      I hope it is clear what I want to achieve. Thanks in advance.
        • 1. Re: Confirmation Dialog when clicking on Tree Node.
          So you'll want to bind an event to all tree nodes that checks for the value and then fires the confirmation if there value is 1.

          Try something like this:

          - first, give your static ID attribute in your tree the value of tree_static_id (or whatever you want. just replace the id selector below with what you choose).

          - In your Page Function and Variable Declaration Javascript:
          function confirmSave() {
          var changeDetected = jQuery('#P0_CHANGES_DETECTED').val();
          if(changeDetected == 1) {
          //only do this if change is detected
          if(confirm('You have unsaved changes. Do you want to leave this page?')) {
          window.location('[your url here]');

          jQuery(document).ready(function() {
          //bind function to the click event
          $('#tree_static_id').find('li a').bind('click', function() { confirmSave(); } });
          Hope this helps
          1 person found this helpful