How to save content changes made by javascript

Question

I've a table with some rows and cells. I can edit inner table content using jquery. But how i can save this edits ? my table:

<table border="1" cellspacing="0">
<tr>
    <th>Teams</th>
    <th>Points</th>
</tr>
<tr>
    <td>Arsenal</td>
    <td id="points">35</td>
</tr>
<tr>
    <td>Liverpool</td>
    <td>33</td>
</tr>
<tr>
    <td>Chelsea</td>
    <td>33</td>
</tr>
<tr>
    <td>Man City</td>
    <td>32</td>
</tr>
<tr>
    <td>Everton</td>
    <td>31</td>
</tr>
</table>

my Jquery code:

<script>
    $(document).ready(function () {
    var val = $("#points").text();
    $("#ss").click(function () {
        val++;
        $("#points").text(val);
    })
})
</script>

<button id="ss">Inc</button>

By clicking on button with "ss" id , the value of td with "points" id increases. So how i can save and update this increase to currently file (without refresh page)?

Save where? Which file? Use ajax if you have to increase and save on the Web server. Use local storage if you need to store on the client, and don't need to access this value on the server. — Yogesh
– Yogesh, Commented Dec 21, 2013 at 6:57
@AliN11 if permanent why not use Database or something else on serverside — rajesh kakawat
– rajesh kakawat, Commented Dec 21, 2013 at 6:59

rajesh kakawat · Accepted Answer · 2013-12-21 07:13:59Z

1

try Html5 Storage jQuery Plugin

If you are using jQuery in your projects and you want to use Local Storage or Session Storage, this is your library. If user's browser doesn't support them it will use cookies instead.

REFERENCE

https://github.com/artberri/jquery-html5storage/

USING AJAX

$(function(){
    var val = $("#points").text();
    $("#ss").click(function () {
        val++;
        $("#points").text(val);
        $.ajax({
            type: "POST",
            url: "some.php",
            data: { points: val }
            })
            .done(function( msg ) {
            alert( "Data Saved: " + msg );
        });
    })
})

some.php

$point = $_POST['points'];
//CODE TO SAVE TO DATABASE GOES HERE

edited Dec 21, 2013 at 7:13

answered Dec 21, 2013 at 6:55

rajesh kakawat

10.9k1 gold badge24 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

tilak · Accepted Answer · 2013-12-21 07:05:00Z

1

Try this :

To store :

<script>
$(document).ready(function () {
var val = $("#points").text();
$("#ss").click(function () {
    val++;
   window.localStorage.setItem("storedValue", val);
    $("#points").text(val);
})
 })
</script>

To get value :

var value = window.localStorage.getItem("storedValue");

answered Dec 21, 2013 at 7:05

tilak

4,7216 gold badges36 silver badges46 bronze badges

1 Comment

tilak Over a year ago

you can clear specific value like this : window.localStorage.removeItem("storedValue"); , all values using - window.localStorage.clear(); , am not sure about is it permanent or not . May be all data cleared when u clear the browser cache.

Collectives™ on Stack Overflow

How to save content changes made by javascript

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related