I'm having a problem. I got this to work in Chrome, Safari, and Opera, but it's not working in Firefox and IE. Perhaps one of the pro's here can copy and paste this to notepad and test it locally to see what the deal is. Much appreciated.
Code:
<html>
<head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'/></script>
<script type="text/javascript">
var Storage = {};
Storage.webdb = {};
Storage.webdb.db = null;
Storage.webdb.open = function() {
var dbSize = 5 * 1024 * 1024; // 5MB
Storage.webdb.db = openDatabase("Todo", "1.0", "Todo manager", dbSize);
}
Storage.webdb.createTable = function() {
var db = Storage.webdb.db;
db.transaction(function(tx) {
tx.executeSql("CREATE TABLE IF NOT EXISTS todo(ID INTEGER PRIMARY KEY ASC, todo TEXT, added_on DATETIME)", []);
});
}
Storage.webdb.addTodo = function(todoText) {
var db = Storage.webdb.db;
db.transaction(function(tx){
var addedOn = new Date();
tx.executeSql("INSERT INTO todo(todo, added_on) VALUES (?,?)",
[todoText, addedOn],
function() {
Storage.webdb.getAllTodoItems(loadTodoItems);
},
Storage.webdb.onError);
});
}
Storage.webdb.onError = function(tx, e) {
alert("There has been an error: " + e.message);
}
Storage.webdb.onSuccess = function(tx, r) {
}
Storage.webdb.getAllTodoItems = function(renderFunc) {
var db = Storage.webdb.db;
db.transaction(function(tx) {
tx.executeSql("SELECT * FROM todo", [], renderFunc,
Storage.webdb.onError);
});
}
Storage.webdb.deleteTodo = function(id) {
var db = Storage.webdb.db;
db.transaction(function(tx){
tx.executeSql("DELETE FROM todo WHERE ID=?", [id],
function() {
Storage.webdb.getAllTodoItems(loadTodoItems);
},
Storage.webdb.onError);
});
}
function loadTodoItems(tx, rs) {
var rowOutput = "";
var todoItems = document.getElementById("todoItems");
for (var i=0; i < rs.rows.length; i++) {
rowOutput += renderTodo(rs.rows.item(i));
}
todoItems.innerHTML = rowOutput;
}
function renderTodo(row) {
return "<span style='float:left;'><textarea class='box' style='width:300px;height:100px;' type='text' id='textArea' name='texttocopy'>" + row.todo + "</textarea><a href='javascript:void(0);' onclick='Storage.webdb.deleteTodo(" + row.ID + ");' style='background:#fff;'><img src='http://markitup.jaysalvat.com/_images/icons/close.png'title='Delete'/></a></span></div>";
}
function init() {
Storage.webdb.open();
Storage.webdb.createTable();
Storage.webdb.getAllTodoItems(loadTodoItems);
}
function addTodo() {
var todo = document.getElementById("textarea");
Storage.webdb.addTodo(todo.value);
todo.value = "";
}
</script>
<script type="text/javascript">
function doSetItem() {
var name = 'store';
var data = document.forms.f.textarea.value;
localStorage.setItem(name, data);
}
function doGetItem() {
var name = 'store';
document.forms.f.textarea.value = localStorage.getItem(name);
}
function doRemoveItem() {
var name = 'store';
document.forms.f.textarea.value = localStorage.removeItem(name);
}
function doClear() {
document.forms.f.textarea.value = ""
}
</script>
<script type="text/javascript">
function start() {
init();
doGetItem();
}
window.onload = start;
</script>
</head>
<body>
<form name="f">
<!----- TEXTAREA ------>
<textarea id="textarea" style="resize: none; height: 300px; width: 300px;" onkeyup="doSetItem();" wrap="soft" spellcheck="false">
test
</textarea>
<a onclick="doClear();" title="Clear"><img src="http://cdn1.iconfinder.com/data/icons/diagona/icon/16/101.png"></a>
</form>
<!---- SAVE --->
<h3><a href="#" title="Save" onclick="addTodo(); return false;">Save</a></h3>
<!--- SAVED ITEMS --->
<div id="todoItems"></div>
</body>
</html>
Do please read the posting guidelines regarding silly thread titles. The thread title is supposed to help people who have a similar problem in future. Yours is useless for this purpose. You can (and should) edit it to make it more meaningful.
You would do best to post this in the Jquery (Javascript Frameworks) section of the forum.
Do please read the posting guidelines regarding silly thread titles. The thread title is supposed to help people who have a similar problem in future. Yours is useless for this purpose. You can (and should) edit it to make it more meaningful.
You would do best to post this in the Jquery (Javascript Frameworks) section of the forum.
Speaking of useless....
Either you have a solution to my problem, or you don't? This is a forum to seek help, correct? I don't have time to conjure up fancy titles. I'm a straight shooter. Quick and to the point.
Now if someone can actually take the time to help me find a solution, instead of wasting time (yours and mine) dissecting it for any other reason, I would greatly appreciate it.
P.S. When a person works all day on a project, and is frustrated with a problem that needs solving, the last thing that person might want to do is read "the guidelines".
P.S. When a person works all day on a project, and is frustrated with a problem that needs solving, the last thing that person might want to do is read "the guidelines".
Well, that is simple. If as a newcomer you are unwilling to follow the forum guidelines, then you cannot expect people to devote their voluntary unpaid time and expertise to your question. OK?
Well, that is simple. If as a newcomer you are unwilling to follow the forum guidelines, then you cannot expect people to devote their voluntary unpaid time and expertise to your question. OK?
No, I'm confident their are plenty of nice people, who would be willing to help me out, as I have others, without the unnecessary nagging.
You are obviously not capable of handling my problem, so step aside and let a pro take care of it.
But thanks again for the hand slap for catching me not reading the "guidelines". Tsk tsk... I'm a bad, bad boy. You've done Codingforums true justice in handling menaces, like me.