I have dgrid with paging, 50 rows per page, and using a memory store
The last 2 columns are editable select and filtering select, so when I change page it takes some time.
The problem is that there is not indication to the user that something is happening.
No loading message or a spinning image.
So I want to know if there is an event that fires up before the change of page, so I can manually show a spinner.
So far I have not been able to find such an event.
I used firebug to listen to all click that fires up when I click on the grid, and clicked on the next button to see what will happen.
The only event that fired up was after the rendering of the page. Before the rendering I got nothing.
So how can I show a busy indicator to user when I change page on the dgrid?
A div with the class dgrid-loading is added to the content area of the grid when Pagination loads a new page, and that div spans the full width and height of the content area. You can add styles to this class to add a loading indicator.
You can also add a loading message via the grid's loadingMessage property.
There's an explanation and demonstration of the loading node in the Grids and Stores tutorial in the Customizing Messages section.
Related
I have to scroll right in cypress for a specific view part. Sometimes it automatically detect, but sometimes after scroll only it detect the button. Scrollbar has no unique ID. What is the solution for this scenario?
I tried cy.scroll(500,0) but this dont work
You can get the element then use .scrollIntoView() chained to the returned element.
cy.get('#uniqueId')
.scrollIntoView()
// now it will be in current viewport
I am using the vue-masonry library. At first I have 6 items, so I crated a LoadMore Button to see more of them. The problem is, that when I am in mobile, the items load perfectly, but the viewport changes. see the image attached.
Is there something I can do, to prevent the scrolling movement?
I have a user control with a bunch of buttons behind a scroll viewer that has a grid with a bunch of rows in it. The first row is empty. The buttons in user control need to respond to tap/click when not obscured by scroll viewer's content. My problem is that the scroll viewer caches the tap event and it is not passed to the user control because it is a sibling to the scroll viewer. I would like to somehow pass/propagate the tap event to the user control to get the buttons working. I can't find a good solution to this issue because there seems to be no RaiseEvent(e) method on UI elements in uwp. Due to specific requirements, the whole page needs to react to scroll and the buttons are required to be behind the scroll viewer content. Does anyone know if it is possible to pass the whole event to another element or somehow allow for both controls to handle it? Thanks in advance.
Working on a car dealership site and playing with vue router.
The issue currently is that I have a homepage with a grid of vehicle, when clicking to view one on its own page I have to wait for the random parts to load in ,which causes page height jumps etc.
Is there a way I can trigger the view to load a method but only change the route and view when I say to (api has returned a response)?
On YouTube for example, you click a link and get the progress bar before the view changes.
Thanks.
The issue with your page height jump could be resolved by this.
As for pre-loading the data, you can use the beforeRouteEnter() function, here.
I am developing a windows 8 app using JavaScript & HTML.
I have a page which has different sections laid horizontally. I have links for these sections in another page. I want the page to load from that specific section (meaning page should start from this section).
I am using a grid template and have a listview in the main page. When i click on any item in a group ,navigate to that page and come back to the main page. I want the main screen to load from the section that i have selected before.The screen should automatically scroll to that section like how it is happening from semantic zoom.
Any help in this regard will be of great use.
Thanks
For the first part, it should be enough to set the scrollLeft property of the container to the offsetLeft property of the element you want to scroll to.
The second part can be achieved by storing the scrollPosition attribute of the ListView before navigating away and setting it to its old value after navigating back.
As Ma_li said, scroll-left is one solution -- especially for non ListView content. The key here is how much of the experience you want to maintain when navigating back. One option (again, for non-listview content) is to find the element you want to be onscreen, and calling scrollIntoView on the element. However, this only brings the item on screen -- it won't bring it all the way to the left (or right, for BIDI languages), it scrolls just enough to et the whole element on screen.
For ListViews, you should use the indexOfFirstVisibleItem (or, indexOfLastVisibleItem) to scroll the listview to the correct location. This is key, because the listview is a virtualized control, this provides the most accurate & reliable method for scrolling the listview position.
Thanks Dominic & ma_il
I tried document.getElementBy("Id").focus() for the 1st Question and it worked. But i am getting a problem in this.
I have four divs Horizontally say "divA divB divC divD"
Data for the divA is coming from cloud. When i click on the link for divD in the main screen. it is not taking me to the corresponding section for the first time as it takes some time to load the divA. when click on the link for divD second time, it takes to the respective section. It is working if i use setInterval() but the DivA is shown for few seconds when the page loads and then scrolls to divD which is not good.