I have a date changing script. How can i prevent refreshing the date on page refresh? Since my date is stored in h3 as a simple string. Just in future i need to show specific data corresponding to date. Does Jquery .change() method is used only on input fields? And also is it possible to use AJAX to update some data corresponding to the date stored?
Demo : Jsfiddle
<button id="yesterday">yesterday</button>
<button id="tomorrow">tomorrow</button>
<h3 id="today_date"></h3>
To stop the date changing on refresh, you'll need to store it somewhere. Probably best done with local storage as opposed to a database, until the user has set a final date. You don't want to add to a DB on every click of the button.
Using local storage, you would set the date on each click of the button, and on page load check to see if a date has been saved. If so, show that date.
You can see how it can be done by looking at this pen: http://codepen.io/jhealey5/pen/KldjC - It's similar in that it adds to storage on each click of adding a note, and checks storage on page load. Should be able to adapt it to your needs.
And yes, you can then post it somewhere with Ajax whenever. But it's probably not a good idea to do it every time the button is clicked, depending on what you're trying to do exactly.
Hope that helps.
Ed: have to add some code for the codepen link...
localStorage["notes"] = JSON.stringify(storedNotes)
You can use 'DOMSubtreeModified' event to check whether the value is changed.
$("#today_date").on('DOMSubtreeModified', function () {
alert("date changed");
});
if your target browser is IE, you can use 'propertychange' event.
$("#today_date").on('DOMSubtreeModified propertychange', function () {
alert("date changed");
});