FAQ Database Discussion Community


Preventing page navigation inside a Backbone-driven SPA

backbone.js,browser-history,pushstate,backbone-routing
The justification In my BB app, I allow rapid input from users which gets queued & sent off periodically in the background to the server. The problem I currently have is if a user leaves the page they effectively discard any pending changes sitting in the queue. So basically what...

History pushed state is not in standalone location.hash or location.href but is in Location object itself

javascript,html5,pushstate,html5-history
Can anyone explain this behavior? I push history state using history.pushState(null, null, '#test');. Then when trying to get state URL in the listener function (didn't find a better way how to listen to pushState changes) using console.log(window.location.hash), it returns empty string, #test hash. console.log(window.location.href) returns whole URL without hash #test...

Calling history.pushState on dataTable rowSelect

javascript,jsf,primefaces,datatable,pushstate
I'm using PrimeFaces 5.1 and I call history.pushState when the user clicks on a p:dataTable row using the following code : <p:dataTable value="#{associateBean.scenarios}" selectionMode="single" selection="#{associateBean.selectedScenarioViewBean}" var="scenarioViewBean" rowKey="#{scenarioViewBean.id}"> <p:ajax event="rowSelect" listener="#{associateBean.onScenarioRowSelect}" oncomplete="history.pushState('','','test#{scenarioViewBean.id}')" update="@form"/> <p:column> <h:outputText...

navigate not working ONLY for empty fragment after enabling pushState

javascript,.htaccess,backbone.js,marionette,pushstate
So, I had a Backbone Marionette app fully working with hashes. Then, I decided to enable pushState for better UX URLs. I access the app at: http://localhost:8888/multikanban/app I applied the following changes: Enable pushState Backbone.history.start({pushState: true, root: "/multikanban/app/"}); Define the following .htaccess <ifModule mod_rewrite.c> RewriteEngine On RewriteCond %{REQUEST_FILENAME} !-f RewriteCond...

weird issue with pushState/popstate - initial page seems to have been “pushed” twice

javascript,pushstate
I'm having a weird issue with pushState/popstate where it seems my initial page is saved twice. It's a bit hard to explain without an example. something like this: current page is www.bing.com copy/paste my URL into URL bar and page loads click on a link on the page (this link...

How to manipulate browser history and catch browser back/forward buttons?

javascript,jquery,html,google-chrome,pushstate
I've been searching for couple of hours now trying to make a simple browser history manipulation. I have a couple of menu links and I bind click handlers to them. Links' href's are just hashes: href="#Home" or href="#About". I would like to display a subpage when user clicks on link,...

Add items in URL without page reload (pushState)

javascript,jquery,html,ajax,pushstate
I have a function that adds items in my URL without page reloading. I use this in a filter function. Every time some one clicks an item in the filter, this function will add the clicked item in the URL. If you click the same item again, the item will...

.htaccess configured for pushState support; page errors on multi-parameter URL

.htaccess,routes,pushstate
I am using the following configuration in my .htaccess file to enable support for HTML5 pushState navigation on a website: # HTML5 pushstate support RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule ^ / [L] This works works great when the url of the website is something like: www.example.com/foo However, I...

How to make pushState/onpopstate and jQuery events (e.g. on click) work nicely?

javascript,jquery,pushstate
I am able to successfully use pushState and onpopstate to use the back/forward buttons on my AJAX enabled page. One aspects of the AJAX feature is to automatically refresh a dropdown list when a link in clicked. This is my code this feature. <a class="type" href="#Chr(35)#" data-type="B">B</a> | <a class="type"...

How to implement deep linking client on top of HATEOAS server?

single-page-application,pushstate,hateoas
There's a similar question on SO, but it's not phrased well and it lacks details. So I'm trying to write a better question. I'm interested in how to implement HATEOAS with a single page application (SPA) that is using pushState. I want to preserve deep linking so that users...