I am having an issue with navigation in my app. The page hierarchy works like so:
Top
VisitComponent (non-tabbed)
CheckInPage (non-tabbed)
ClientGenericPage (tabbed)
HelloIonicPage (non-tabbed)
Root
A standard flow of events would be:
Start at the HelloIonicPage
push() the ClientGenericPage
Select the tab corresponding to the CheckInPage
push() the VisitComponent from a button on the CheckInPage
The issue arises when I attempt to pop() from the VisitComponent. I would expect to end up at the CheckInPage but instead I end up at the HelloIonicPage (root component).
When I call this.navCtrl.getViews() I see an array of 2 views: [CheckInPage, VisitComponent].
I am really at a loss as to why I would end up at the root after calling this.navCtrl.pop().
As it turns out, the ClientGenericPage header was displayed on top of the VisitComponent header, and thus clicking back was firing the event on the parent, not the child.
Related
So I found out using the destdiv parameter in the CustomSearch causes an infinite fade loading process.
{CUSTOMSEARCH( wiki="Custom search 12" id="searchfix" destdiv="displayFirstTabDiv")}
I have two tabs on a page each having its own respective CustomSearch for tab content, the problem is any search on Tab1 picks content and display on Tab2 instead of Tab1. Tab2 behaves well.
I thought of having destdiv to restrict display of Tab1 result to a Div on Tab1 but it goes into an infinite load. Perhaps I am missing something.
I'm developing an ionic app, I faced a problem where I'm on Page A going to Page B with query string ex:
Page A: #/app/channels-inside?id=30
Page B: #/app/nowplaying
This is where the problem lies. When I click the back button it goes back to the correct page but without the query string (URL becomes #/app/channels-inside. How do I handle this where I want to redirect to previous page with the id in it?
I think you should use it.
AngularJS: $ stateParams
.controller('yourCtrl', function ($scope, $stateParams){
$stateParams.id
})
This cant be achieved with default pop() method as its action is limited to popping the component from navigation array. What you can do is use insert and remove functions of NavController. Insert channel-inside in the navigation stack with the params you want. Then remove now-playing and already existingchannel-inside.
insert(insertIndex, page, params, opts)
Inserts a component into the nav stack at the specified index. This is
useful if you need to add a component at any point in your navigation
stack.
remove(startIndex, removeCount, opts)
Removes a page from the nav stack at the specified index.
Check out the docs.
Edit
Or you could use Events to pass the params
constructor(public events: Events) {}
// in now-playing
function createUser(user) {
console.log('User created!')
events.publish('user:created', user, Date.now());
}
// in channel inside
events.subscribe('user:created', (user, time) => {
// user and time are the same arguments passed in `events.publish(user, time)`
console.log('Welcome', user, 'at', time);
});
I am automating testing of a response web app and have an issue with multiple elements on the page with the same #FindBy selector where only one is visible at a particular screen resolution (in this case a logout button that 'moves' around the screen).
I could just get a list of webelements and click on the first visible, but I was wondering if I could do something smarter using html elements:
Given the following annotation
#FindBy(css = ".logoutButton")
MultiWebElement logoutButton;
When I call this method
logoutButton.click();
Then the MultiWebElement class will iterate over all elements that match the find by and call the click method on the first one that isDisplayed().
Unfortunately the decorator seems to want logoutButton to be of type List which defeats the purpose of creating the new class.
Can I do something like this, or is this outside the current scope?
I have a page with many elements (forms and tables)
When I want add a row in a table I scroll the page to the table, I press a button to add a row, edit the info in a popup and press OK.
Then I insert the new row in the model and refresh() the model.
At this point the page auto scroll at the top, but I don't want this behavior!
I want that the page stay in the same Y position!
I see that sap.m.page has scrollTo function https://openui5.hana.ondemand.com/docs/api/symbols/sap.m.Page.html#scrollTo
but I don't know how take the position before the refresh()
The Page does unfortunately not have an API to get the current scroll position, but the idea is a good one we consider.
As a workaround you could access some private method of the Page - but only if you accept the risk that it breaks with a future version of UI5:
page.getScrollDelegate().getScrollTop()
To make it safer you should verify both methods exist before calling them and also check the returned value for plausibility. Then you are pretty safe that in the worst case it will again scroll to the top in some future UI5 version.
you have to fill the iTime parameter in scrollTo function - e.g. srollTo(100, 1) - then it works
using 0 for iTime does not work
I'm using Extjs5.1 powered by a MVC oriented code style.
I've got a main view which inherits from Ext.panel.Panel with a border layout.
On the east region, there's a grid with a store containing several records (or "models", I don't really know what terminology I should use here). (the "master grid")
On the center region, there is another view that inherits from a Ext.form.Panel and which is supposed to display the selected item of the grid . (the "slave form")
My goal is to refresh the "slave form" with the selected record of the "master grid".
The only way I found to "communicate" between the grid and the form is to execute a fireEvent('selectRecord', ...) from the main view controller and to listen to him inside the form view controller, but it seems odd as the form view is a child item of the main view.
Is there a more common way to do that?
By corrolary, is it a fine practice to make a view call functions of another view directly or should I make only their respective controllers interact?
What I usually do and I believe is the most common approach for this, is having a selectionchange event listener, that updates your form like this:
listeners : {
selectionchange: function(model, records) {
var rec = records[0];
if (rec) {
formpanel.getForm().loadRecord(rec);
}
}
}
for this to work, the name property of your form fields must match the name of the fields in the grid store model.
There is an example of this here: http://dev.sencha.com/extjs/5.1.0/examples/kitchensink/#form-grid