Visual Builder

Get Involved. Join the Conversation.

Topic

    Stephen Bryant
    navigating between pages (passing parameter to edit...Answered
    Topic posted August 13, 2019 by Stephen BryantBronze Trophy: 5,000+ Points, tagged Action Flows, Custom Code, UI 
    32 Views, 4 Comments
    Title:
    navigating between pages (passing parameter to edit page)
    Summary:
    based on John Jullion-Ceccarelli's Blog
    Content:

    John's blog is here:

    https://blogs.oracle.com/vbcs/navigating-between-pages-and-flows

    Here is what I have:

    A main page with a hyperlink.

    The hyperlink is clicked and the user is navigated to the Edit page.

    I have no problem doing that but it is not passing the parameter.

    I followed Johns blog exactly and just will not work.

    Also, I even tried John's approach in the file provided on the blog but that does not even work.

    I've configured the hyperlink action and shell actions properly but it will not work.

    Has anyone been able to get this to work?

    It is straightforward so I am wondering if there is another way.

    Thanks,

    Steve

    Version:
    19.1.3

    Best Comment

    David Konecny

    Ahh, so it is two different flows after all. Looking at your code snippet it is indeed wrong - payload value is what gets send so in your case it needs to be something like this:

              "parameters": {
                "name": "customNavEvent",
                "payload": {
                  "page" : "setup/setup-edit-fv-treasury-symbols",
                  "fvTreasurySymbolsId":"{{ $chain.variables.fvTreasurySymbolsId }}"
                }
              }
    

     

    Note that in your code snippet you are sending "$chain.variables.fvTreasurySymbolsId" which is wrong - it is static value (you did not select Expression in Assignment mapper). You need to enter it as expression, that is "{{ $chain.variables.fvTreasurySymbolsId }}"

    Then open your shell/navigateToPage action and double check that it looks like this:

                 "root": "navigateToPage1",
                 "description": "",
                 "variables": {
                     "page": {
                         "type": "string",
                         "required": true,
                         "input": "fromCaller"
                     },
                    "fvTreasurySymbolsId": {
                      "type": "string",
                      "required": true,
                      "input": "fromCaller"
                    }
                 },
                 "actions": {
                     "navigateToPage1": {
                         "module": "vb/action/builtin/navigateToPageAction",
                         "parameters": {
                             "history": "push",
                             "page": "[[ $variables.page ]]",
                             "params": {
                                 "fvTreasurySymbolsId": "{{ $variables.fvTreasurySymbolsId }}"
                               }
                         }
                     }
                 }
    

    That is, that it has your fvTreasurySymbolsId param as required input and that it is passing that param into destination page.

    Then last step is to check that shell page -> Events correctly binds incoming payload into your navigateToPage chain. You should see in property inspector for customNavEvent two required Input Params which needs to be bind: fvTreasurySymbolsId and page. Click assign and (IMPORTANT!) select fvTreasurySymbolsId in target and then set "Expression" at the bottom. And after then enter "$event.fvTreasurySymbolsId". Do the same for page and bind it to $event.page. "$event" here is what we earlier sent as "payload".

    -David

    Comment

     

    • David Konecny

      John's blog is mainly about navigation between flows. Which is trickier. But it sounds that in your case you are within one flow and want to navigate and pass params from main page to edit page?

      The most important part for passing params is to configure the variable on the destination page properly, that is to set all three checkboxes to true:
      * 'Input Parameters"
      * 'Pass on URL'
      * 'Required'
      Once you do that and go back to first page and configure action chain using "navigate to" the destination page you will see in property inspector of navigate to action this destination variable as required. And you bind it and its done. :-) Just call this simple chain from your hyperlink.

      -David

      • Stephen Bryant

        David,

        Thanks again for the response.  I may not have explained it well but check out my image below and you will see it is two flows.

        The first flow is "budgetexecution/budgetexectution-start"

        The second flow is "setup/setup-create-fv-treasury-symbols"

         

        I am not sure what I am doing wrong but the only difference from John's video is rather than pass a value of "john" for his "name" variable, I am picking up the "treasurySymbolId" from the first flow and then navigating to the second flow.  I believe it is there that I am having the issue.

        I was doing something like this in the JSON:

        "parameters": {
                                "name": "customNavEvent",
                                "payload": "setup/setup-edit-fv-treasury-symbols",

                                                 "fvTreasurySymbolsId":"$chain.variables.fvTreasurySymbolsId"

         

        The customNavEvent had all the right config but each time I set the page variable on the shell navigateToPage chain, it would not navigate.

        John's video said to set it to $event.page but that did not work so I left it as $event.  It would drill but not pass a parameter.

        Any thoughts?

        Steve

         

         

         

         

         

         

         

        • David Konecny

          Ahh, so it is two different flows after all. Looking at your code snippet it is indeed wrong - payload value is what gets send so in your case it needs to be something like this:

                    "parameters": {
                      "name": "customNavEvent",
                      "payload": {
                        "page" : "setup/setup-edit-fv-treasury-symbols",
                        "fvTreasurySymbolsId":"{{ $chain.variables.fvTreasurySymbolsId }}"
                      }
                    }
          

           

          Note that in your code snippet you are sending "$chain.variables.fvTreasurySymbolsId" which is wrong - it is static value (you did not select Expression in Assignment mapper). You need to enter it as expression, that is "{{ $chain.variables.fvTreasurySymbolsId }}"

          Then open your shell/navigateToPage action and double check that it looks like this:

                       "root": "navigateToPage1",
                       "description": "",
                       "variables": {
                           "page": {
                               "type": "string",
                               "required": true,
                               "input": "fromCaller"
                           },
                          "fvTreasurySymbolsId": {
                            "type": "string",
                            "required": true,
                            "input": "fromCaller"
                          }
                       },
                       "actions": {
                           "navigateToPage1": {
                               "module": "vb/action/builtin/navigateToPageAction",
                               "parameters": {
                                   "history": "push",
                                   "page": "[[ $variables.page ]]",
                                   "params": {
                                       "fvTreasurySymbolsId": "{{ $variables.fvTreasurySymbolsId }}"
                                     }
                               }
                           }
                       }
          

          That is, that it has your fvTreasurySymbolsId param as required input and that it is passing that param into destination page.

          Then last step is to check that shell page -> Events correctly binds incoming payload into your navigateToPage chain. You should see in property inspector for customNavEvent two required Input Params which needs to be bind: fvTreasurySymbolsId and page. Click assign and (IMPORTANT!) select fvTreasurySymbolsId in target and then set "Expression" at the bottom. And after then enter "$event.fvTreasurySymbolsId". Do the same for page and bind it to $event.page. "$event" here is what we earlier sent as "payload".

          -David

          • Stephen Bryant

            David,

            All fixed!  Thanks again.  I thought it was not passing the parameter even after your fix here.  It turned out I was passing the wrong parameter so it would return no data.  So I created an object function to grab the id based on the treasurySymbol value returned id and assign it to fvTreasurySumbolsId and it worked perfectly and off I go!

            Thanks so much for your prompt replies and transfer of knowledge!

            Steve