I was able to figure this out. I needed to load my main screen different than what I initially had. When I initially loaded the screen I was using a view that had my children(textLabel1, List, messages.messageBottom). The 'List' child had my gridlayout, which also contained my dojoBobileButton to go to the next screen.
View DojoMobileView{standardEvents = [DojoMobileLib.TRANSITION_SLIDE], children=[View2] }; View2 DojoMobileView{headerTitle = "Login", children =[textLabel1, List, messages.messageBottom]}; GridLayout2 GridLayout{style="text-align:center; padding-top:30px", rows = 2, columns = 1, width = "100%", children =[LoginButton]}; GridLayout3 GridLayout{cellPadding = 4, rows = 2, columns = 1, width = "100%", children =[TextLabel2, employeeNoField]}; GridLayout4 GridLayout{cellPadding = 4, rows = 2, columns = 1, width = "100%", children =[TextLabel3, firstNameField]}; LoginButton DojoMobileButton{id="Login", class="responsiveButton", text = "Login", layoutData = new GridLayoutData{row = 1, column = 1}, onPress ::= Button_onPress}; List DojoMobileList{class="login_box", style = DojoMobileLib.LIST_STYLE_ROUNDED_RECTANGLE, children = [ListItem]}; ListItem DojoMobileListItem{children = [GridLayout3, GridLayout4, GridLayout2], actionTransition = DojoMobileLib.TRANSITION_SLIDE};
I did not need to bury my 'LoginButton' inside the gridlayout, and the DojoMobileList. I removed the button from the list and the gridlayout. I left the button standalone and added him to the view as a second child. I changed LoginButton from a dojoMobileButton to a DojoMobileListItem.
View DojoMobileView{id="LoginView", children=[View2, LoginButton ] }; View2 DojoMobileView{headerTitle = "Login", children =[textLabel1, List, messages.messageBottom]}; LoginButton DojoMobileListItem{onPress ::= Button_onPress};
Back on the Main screen I loaded the 'LoginButton' when the program initialized. That way it got the necessary actions it needed to transition to the next screen.
case(i) when(1) _views[startList[i]._index ].backView = HomeView; _views[startList[i]._index ].backText = "Home"; (_views[startList[i]._index ].children[2] as DojoMobileListItem).id = "LoginList_1"; (_views[startList[i]._index ].children[2] as DojoMobileListItem).actionView = _views[2]; (_views[startList[i]._index ].children[2] as DojoMobileListItem).actionTransition = DojoMobileLib.TRANSITION_SLIDE; (_views[startList[i]._index ].children[2] as DojoMobileListItem).text = "Login with Credentials";
Now the screen slides to the next screen. I don't like how I had to accomplish this, because if I needed to add something on the Login screen I would possibly need to change which child I need to look at to get to my LoginButton to set the actions. It would be nice to use it the way I had it...where all I had to do is select it.
datePicker.View.selected = true;
This way was also helpful because I was able to stay on the screen if there were errors when the user logged in. Now, I display the error on the next screen, because you can't stop the transition when you tap the 'LoginButton'. With this way I can determine when I need to go to the next screen. With the way it is now...when I use the selected method it makes your mobile device screen jump, it doesn't have that smooth transition from screen to screen.
I like the way the transition works when I use the dojoMobileListItem or dojoMobileButton and is inline with how mobile solutions work now days. So, I ask of you to please add a transition to the 'View' when it is selected.
Gadberry