Saving the Dynamically Changed HTML - javascript

I have done some changes in HTML page dynamically by using jQuery. And if I reload the same HTML it will gets to its initial state. But i don't want that to happen. Is there any way to get it done or save the changes made using jQuery?
Thank you.

If you wish to make changes to a file using jQuery and load it back on the reload you need to use a database in order to save those changes. You can use AJAX or even pure JavaScript to transfer those changes from your form to the database.
And once the changes are saved you can use a combination of PHP, MySQL query and JavaScript or AJAX to dynamically load the changes from the database on to your HTML page or if you want to make it more simple then just use a JavaScript function on page reload to fire a PHP code which will check for changes and if there is any, those will be loaded on to your page.
HTML5 local storage is a temporary solution this will also get retested once you close your browser or clean the browsing data.

You would need to get the innerHTML string and save it to the database or via HTML5 localStorage.
Then onload, all you have to do is check for an existing page state and then insert that as an innerHTML to your parent container:
if(savedState){
myParentContainer.innerHTML = savedState;
}
Where savedState is the variable that holds your html code.
To save the state, you would need to design a save function that would fire every time changes are made or when the user clicks on a save button. As I have said, you can save via HTML5 LocalStorage or via a database. Be wary that HTML5 LocalStorage is very small and can only accommodate several megabytes.

You must need to save your HTML after made changes using Jquery. you could save it by ajax call and save into database. so when you reload page HTML fetches from database so it would work.

Related

Click a button on a page to increment a counter in another page using PHP?

so as the title says, I've a button on my main page which should send the amount of times clicked to another page.
I know how to do this via JS, but not in PHP. PHP is also not live, so I'd need to refresh the webpage in order to see the effect, I've been reading about it and I might try and mess around with AJAX to refresh a certain element of my webpage.
Is it possible to do this?
I think you should save it somewhere because PHP is handled server side. So either a cookie/session or a database.

adding dynamic data to mysql with php j query

I am trying to add multileg travel information using PHP, jQuery and MySQL. I present to users with existing data and then they dynamically add travel leg information to their existing visit. What I have done so far is below.
Bind data (PHP -MySQL) to the HTML table. Show add new button the user.
When the user clicks on add new, I have used jQuery to clone the data and this has dynamic id.
On the form there is file upload as well which needs to upload the file and also save information in the database.
My problem is how can I rebind the data on the table without effecting any other thing. I have tried to use jQuery load but it tries to reload the entire page rather than just reloading the newly generated trs.
I am open to change my logic on the whole as to how I do this.
Appreciate any help on this.

Go to previous html page without refreshing the data

Am using onLoad function of html page to fetch the data from server and to update the table rows with angularJS ng-repeat. Whenever I go to another html page and returns back, onload function is executing and it causes a delay. I need to return to the previous html page without refreshing the data.
You've got a couple of options -- the best one tends to be saving a flag inside of a window.sessionStorage and storing the data there as well.
Note that sessionStorage is unique to each window/tab and is temporary, unlike localStorage which is more long term.
You can even set a time/date stamp to determine how old the data can get before it is considered stale and needs refreshed.

Show preview on new page

I have editor that I can get it's code with js in my page and user can write his html code in it. I want show current user's html code in new window without saving the code in database or something else. How can I do that?
hi why dont you store your values in html5 storage objects such as sessionStorage/localStorage, visit Html5 Storage Doc to get more details. using this you can store intermediate values temporaryly/permanently locally and then access your values
for storing values for a session
sessionStorage.getItem('label')
sessionStorage.setItem('value', 'label')
or store values permanently using
localStorage.getItem('label')
localStorage.setItem('value', 'label')
So you can store (temporarily) form data between multiple pages using html5 storage objects
YOu can use the sessionstorage object to store the user's code temporarily for a session and get it on next page using above syntax
Follow steps below :
On the preview page, place an IFRAME.
From the first page, where user inputs HTML, set a session variable.
On click of some button on first page, set the session and redirect to preview page.
The preview page is supposed to fetch the session value and display it inside the IFRAME
This might help you:
JSBin Demo

Refreshing jsp in tiles

I am creating a webpage using jsp and tiles. My issue is that I have a timer.jsp attribute in my tiles page which acts like a countdown timer. I want its value to remain unchanged on refreshing the page. Is there anyway I can do this?
In order to preserve the value of a client-side timer across refreshed you have to store it in the session via ajax. Something like (with jQuery):
$.post("storeInSession", {value: $("#item").val()});
where /storeInSession is mapped to a servlet (or action, depending on the framework in use) which gets the value request parameter and sets in as session attribute.

Categories

Resources