scrollIntoView angular application - asp.net-web-api

I am working on an Angular single page application. I have a navbar. I am using fragments to jump to section and anchorScrolling is enabled.
How should I scroll to a specific section when refreshing the page and when the URL contains the hash fragments? xx/#sectionToJUmp.
I have tried scrollIntoView, in the ngAfterViewINit(), but it's not working. The specific section is in a position, but it goes down when other sections are loaded. The scroll remains in the before position. How to get it in the specific section position? Thank you

Related

In the vue3 project, when I jump to the page, the height of the elements in the jump page from the top cannot be calculated correctly

In the vue3 project, when I jump from one page (home page) to another page (details page), the height of the elements in the details page from the top cannot be calculated correctly, but when I refresh the details page, it can Calculated correctly, how to solve this problem?
Explanation: I am executing this method in setup syntactic sugar。
I tried adding scrollBehavior attribute to router
Although the page after the jump can be placed at the top, the height of the elements inside is not correct from the top

NativeScript Vue - Best way to navigate to other components while maintaining the same top section that has profile info?

I want to have a top section for logged in users that has logged in status and profile avatar but I want everything below that different components. How can I navigate to other components while a consistent topbar section? Do I have to include the top bar code on every component?
Frame is the UI element that's responsible handling navigation. A Frame can display one Page at a time which can have a ActionBar.
If your intention is not to just duplicate the ActionBar code in every page, write Vue component that will only contain your ActionBar which can be imported in every other component.
You may use nested frames too, let the outer frame hold the ActionBar consistent over navigations on inner frame.

Xamarin Forms: Values vanished/refreshed on swiping more than four content pages inside carousel page or tabbed page

I am working on a xamarin forms project which have a carousel page container, and content pages as its children are created dynamically on different condition checks. (Minimum 8 children in my case)
Let's take the mentioned minimum case. I enter some values in entry/picker controls in the 1st child and then navigate/swipe pages till 5th child. When I came back to the first child page, the values I entered/selected are now vanished/refreshed.
I have noticed that carousel page saves only 3 pages data in it. i.e. (Left Page, Current Page and the Right Page).
And Tabbed page saves 4 pages data.
I want the values to stay in the child page where I entered whether I navigate to the last most page or in the middle and navigate back to that page.
I have googled via the letters as "Carousel page/ Tabbed page Saved states" etc. but unable to find something useful.
So, I need to know the property name/ method name etc. by which xamarin forms setting the limit of carousel page as 3 and tabbed page as 4.
Waiting for your response.
Thanks.
OK I found that I was using a Custom Picker Control and the value refreshing issue is with it. I just forget to set the selectedIndex of the picker on OnElementChanged event.

Setting anchor on page on refresh/pageload

I have a page that contains an area about halfway down the page that filters properties (custom post type) by Price, Bedrooms, and Sq Ft. The filter works fine, however upon filtering the properties (by clicking any of the filters), the page refreshes back to the top of the page, causing the user to have to scroll down the page to see the filtered results. I am wondering how I would go about attaching an anchor to those links so the page refreshes to the filtered posts area of that page so the user does not have to scroll down again. Would this be done by firing an event via JS or how exactly would this be done?
Ive attached my link below. All and any insight is much appreciated!
Scroll down to "View Quick Move in Homes" to view properties and filters - http://www.daybreakutah.com/find-a-home/
1) Give an id to the tag you want to scroll down to:
<h2 id="filter1">
2) In your hrefs, add #filter1 (or whatever you called it) to the end of the URL:
<a href="http://www.daybreakutah.com/find-a-home/#filter1">

Infinite scrolling inside a div with AJAX (jQuery) loaded date

I've been trying to figure this out over several questions here on SO, finding out the different parts and then assembling them, but now I'm giving up.
What I'm trying do do:
The user is on a page, clicks a button and a list of content loads into a div using jQuerys .ajax. When he or she scrolls to the bottom of the div, load more content. As seen on Twitter, but this is inside a div.
I've seen examples on how to have infinite loading in scroll, but the problem is that those examples reload the entire page (it seems)
Has anyone got any idea how I can accomplish this?
As said, I cannot accomplish this using normal means.
The page is build as:
Page 1, has a div, empty until the user clicks a button.
Page 2 loads a lot of content. When the user clicks on the button on page 1, this is loaded into the div.
When the user scrolls through the div (It has overflow set to auto) and ends at the bottom of the div it should load the next page or so to speak.
Thanks in advance! :)
There are some plugins which do this for you quite well.
http://www.webdeveloperjuice.com/2010/02/24/create-infinte-scroll-effect-using-jquery-with-demo/
http://www.beyondcoding.com/2009/01/15/release-jquery-plugin-endless-scroll/
EDIT: Some more up to date plugins:
https://github.com/fredwu/jquery-endless-scroll
http://www.infinite-scroll.com/infinite-scroll-jquery-plugin/
Use the JQuery.load() method to grab some html content and then insert it into an html element.
If you're using Paul Irish's Infinite Scroll, you can just specify a binder as one of the arguments where you have implemented infinite scroll, just like this:
$('.mydiv').infinitescroll({
binder: $(".name-of-div")
The binder is set to the document window by default, but if you specify it, you can have infinite scroll running simply inside one div on your page

Resources