RoadMap UI Navigation Problem

[AlexGiguere]

I'm facing a navigation problem using the roadmap UI in WD4A.

Let's say we have 5 views. The roadmap view is the default view, the other views will be embedded into a view container UI element on the roadmap view. The roadmap UI has 4 steps, one for each view.

V_ROADMAP

V_STEP_1

V_STEP_2

V_STEP_3

V_STEP_4

Now, I need to add navigation buttons (previous & next) to navigate between the roadmap steps.

My question is where should I placed these navigation buttons? On each view or only on the roadmap view.

Personnaly and it think it would make more sense to place them only on the roadmap view.

My problem using this approach is has follow: When you are on v_roadmap on step 1 (V_STEP_1), you click on Next to go to the next view (V_STEP_2), actually the action is trigger in V_ROADMAP so I am not able to validate user input field or obligatory field in V_STEP_1. I would have to call an action from V_STEP_1 in V_ROADMAP so the event handler method WDDOBEFOREACTION will be called. I don't think it's possible. The problem here, is you can click on next and you can go to the next view without filling the obligatory fields.

If I placed my navigation buttons on each view. The advantage is that before triggering an action, I can validate user input field, obligatory field in the method WDDOBEFOREACTION before going to the next step.

The desadvantage is that I have to recreate them on each of my view.

thanks

Alex

[Former Member · Accepted solution]

Hi,

I think that you pretty much answered your question by yourself. I think that it makes more sense to add the next&previous buttons to the corresponding view itself, if you need to validate the data on the view. Of course this all depends that what kind of overall context design you have. It might make sense to to the "main view" also. I think that you are the best person really to decide the best option, since you now the details of your component.

Also take a look to demo_roadmap component in the system. In that demo component the buttons have been added to the "main view", but of course in that component there isn't really any data validation, so this doesn't you help that much.

Have fun,

Karri

[AlexGiguere]

Just to close this thread, I will summarize the different possible options:

Navigation buttons on each view: This is the easiest way to validate obligatory fields but for component reuse it's not good idea to have navigation buttons on individual views.

Navigation buttons on main views: If we placed the navigation buttons on our main view, the validation is kind of painful, before firing an outbound plug from the main view and a corresponding inbound plug on the individual view, we will have to manually verify our obligatory fields from the context of the componenent controller or using cross-component data sharing.

Navigation using GAF (Guided Activity Floorplan): I think this option is the way to go! The problem here is that's very difficult to find documentation on that subject, also, the tools from SP 15 is not as user friendly then the one that's coming in NW EhP1.

Alex

[thomas_jung]

If your support package is recent enough, then you might want to consider checking out the Floorplan Manager. There is a floorplan called Guided Activity Floorplan. The Roadmap UI and Navigation are all provided by the standard SAP component. You setup the steps of the Roadmap via component configuration. This means you can avoid the kinds of coding that you are asking about here and let SAP handle it. Events are triggered into the subcomponent before the changing of steps to make sure that validation within each step of the roadmap can occur. Check out the packages named APB_FPM_DEMO and APB_FPM_TEST for example code.

[AlexGiguere]

Yes, I have seen that at your session at TechEd, very cool. We are on SP 15, I don't know if we should wait to the new FPM in NW EhP 1 or using it ASIS? Will my development will be compatible?

thanks

[thomas_jung]

> Yes, I have seen that at your session at TechEd, very cool. We are on SP 15, I don't know if we should wait to the new FPM in NW EhP 1 or using it ASIS? Will my development will be compatible?
> 
> thanks

Your development should be compatible in general. I actually started one of the FPM demos from TechEd on SP15 before upgrading to EnhP1 and I didn't have any problems with it. There could be a few changes to programming APIs of the FPM - but I didn't encounter any of these.

The main difference is that the configuration tool has been redesigned. The 7.0 version is just a bit more difficult to use but has pretty much all of the same capabilities.

[Former Member]

Hello there,

check this tutorial out....it is a great one...

https://www.sdn.sap.com/irj/sdn/go/portal/prtroot/docs/library/uuid/a092160b-6165-2b10-e9a2-d484e6b8...

Thanks...

[uday_gubbala2]

Hello J Are,

The tutorial is a good one but you need to keep in mind a few things while you try to replicate the same:

1) As soon as you run the application the first step of the roadmap u201CStartu201D isnu2019t enabled. Both the u201CStartu201D & the u201CInputu201D steps get enabled when you click on the u201CNextu201D button. You can overcome this by removing the binding to EN_START & making it as always enabled.

2) The view navigation doesnu2019t work by clicking on the roadmap steps as how desired. It works only when you click on the "Next" button placed below the roadmap. You will have to change the coding in the onactionselect_step method to get the desired functionality for the same.

Regards,

Uday

[Former Member]

Hi Alexandre,

Ideally the buttons should be on the main roadmap view, since they are meant to be associated with the roadmap and not with each view.

Define the Navigate method in the component controller and try to control your validations from there if possible. This gives you better control on the navigation/validations etc.

Hope this helps

Regards

Wenonah

[AlexGiguere]

ok, but the problem here is how do you validate obligatory input fields?

[Former Member]

Hi,

Try this: I'm not sure if it is going to complicate your development too much though.

Create events in the component controller for validating the data in each view. Handle these events in the individual views. (they should be available sine you have defined it in the comp controller). Fire the appropriate event when the 'Next' button is clicked.

Hope this helps

Regards,

Wenonah