JavaScript History API Basics

[@itsmedheeraj]

You don't how how much this tutorial worth for me, i was searching this for years.. and a word came up History api and here i did what you did, and done! thanks a ton

[@thewhitesc]

your work keeps me motivated to work on big projects !! thank you for your great videos !! keep it up.

[@codecourse]

JavaScript History API Basics

[@bejbejbej1]

What if the user presses the refresh button? What else would i need to do for the user to be able to refresh to the current content they are on, rather than the whole page. if you press the refresh button on what you currently have, it will give an error page. Anyone know a simple way out of this?

Load header and footer on all files and load only content with JavaScript, sorry for delay.

[@1603stanley]

thanks alot for all your free lectures. you have played a very great role in my life . Alex the great. only GOD can continue to reward you. stay blessed

[@codecourse]

loverofCHRIST kk Awesome! That's what we're here for!

[@desdichago]

Amazing explanation, thank you!

[@TransmiTV]

Thank you SO much for this tutorial. Super helpful!!

[@dawizard300388]

Thank you, any videos about the security you are talking at the end of this video ?

[@berkanbilgin2287]

Perfect introduction, thx a lot

[@larrydalmeida8238]

Great intro. Thanks!

[@DamianGarciaIT]

It would be nice if you can also change the title of the page. For example, change "History API" to "History API - Cats", if you select "Cats" and the same for the other link. Should I use "document.title = History API - Cats"?

[@lustigvideoyoutube8052]

Dude thanks very much!!!!

[@bFix]

Good for the basics but would be better in combination with .htaccess and rewrite rules -> the content could be loaded dynamically from a db and you don't need to link to the content.php files manually if you add a new page

[@codecourse]

Thanks for the suggestion. Perhaps we'll create a video on this too.

[@bejbejbej1]

Could you do a tutorial on how to dynamically load content from a db? (htaccess) That would be great.

[@bFix]

I only mentioned the htaccess as a fallback I wasn't very clear on that the dynamic db access is nothing else but ajax that loads a normal php/python page that outputs the new data, but doesn't output the normal page again you use xmlhttprequest 2.0 (ajax) to send your request to a php page, for the php it looks like a normal POST/GET request, it queries the requested data from your db and outputs it either as XML, JSON or even HTML then your js receives the answer and you have to parse the output it might be the easiest way to use json here, for xml and html you have to use xpath/xquery or travel the dom but what you'll use depends on your taste there are surely lots of tutorials out there how to do xmlhttprequests ;) (xhr in short) EDIT: the htaccess would manage to actually supply a full page including the new data, if you copy the link and open a new tab with it (after using the js techniques of this video to alter the browsing history/changing the open URL)

[@bejbejbej1]

Piratekiller99 what do I have to do the code (exact same as the video) so that I can use my index.php (or any other page in the future) as my master page/template. In other words on the links will be within index.php, with everything working from this video? *****

[@TakangacomIndio]

Tu eres el mejor.

[@bejbejbej1]

What if the user presses the refresh button? What else would i need to do for the user to be able to refresh to the current content they are on, rather than the whole page. if you press the refresh button on what you currently have, it will give an error page. Anyone know a simple way out of this?

[@bejbejbej1]

@CodeCourse #CodeCourse

[@dhaferharrathi]

im looking for a solution too :/ any help plz ?

[@ronaldc8634]

@@dhaferharrathi same

[@IIIxwaveIII]

why not use history.pushState(href, null, href); and later retrieve it from popstate's e.state instead of manipulating and parsing location.pathname?

[@SerenityReceiver]

First: Thank you. Then: Why is there "no way" 15:10 of reliably getting the href...? It is relative and it is set by you, also there is nothing to split off of cat.php (which is href).....?

[@nikey646]

***** There is an entirely reliable way of getting the href, you use the first parameter which is an object that will be passed to the OnPopState event, and stored in the history.state object. Why alex didn't just go "new {href:href}" to reliable pass the href is beyond me.

[@Red1ska]

i have problem after fetchAndInsert(href); please help

[@P8860]

Do you have the source code? I followed the tutorial but am getting undefined?=229192

[@ArnoldsKtm]

Can't we use "return false;" instead of "e.preventDefault();"? Never mind lol stackoverflow.com/questions/1357118/event-preventdefault-vs-return-false