Question

This is a continuation from a previous stackoverflow question. I've renamed some variables so that I can tell what are keywords and what are names that I can control.

Q: Why is the deleteRow function not working?

<html>
<head>
<title>html5 openDatabase Hello World</title>
<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("jquery", "1");
google.setOnLoadCallback(OnLoadCallback);

function OnLoadCallback() {
    var dbo;
    dbo = openDatabase('HelloWorld');

    dbo.transaction(
      function(T1) {
          T1.executeSql(
              'CREATE TABLE IF NOT EXISTS myTable ' +
              '  (myTableID INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT, ' +
              '   Field1 TEXT NOT NULL );'
          );
      }
    );

    dbo.transaction(function(T2) {
        T2.executeSql('SELECT * FROM myTable',[], function (T6, result) {
          for (var i=0; i < result.rows.length; i++) {
            var row = result.rows.item(i);
            $('#savedData').append('<li id="'+row.myTableID+'">' + row.Field1  + '</li>');
          }
        }, errorHandler);
    });

    $('form').submit(function() {
      var xxx = $('#xxx').val();
      dbo.transaction(
          function(T3) {
              T3.executeSql(
              'INSERT INTO myTable (Field1) VALUES (?);', [xxx], function(){
                    $('#savedData').append('<li id="ThisisWhereIneedHELP">' + xxx  + '</li>');
                     $('#xxx').val('');
              },
              errorHandler
              );
          }
      );
      return false;
    });
    $('#savedData > li').live('click', function (){
        deleteRow(this.id); 
        $(this).remove();
    });
}

function deleteRow(myTableID) {
    alert('trying to delete');
    dbo.transaction(function(T4) {
        T4.executeSql('DELETE FROM myTable WHERE myTableID = ?', [myTableID], function(){
            alert('Deleted!');
        }, errorHandler);
    });
}

function errorHandler(T5, error) {
    alert('Oops. Error was '+error.message+' (Code '+error.code+')');
    // T5.executeSql('INSERT INTO errors (code, message) VALUES (?, ?);',
    // [error.code, error.message]);
    return false;
}
</script>
</head>
<body>
<form method="post">
    <input name="xxx" id="xxx" />
    <p>
    <input type="submit" name="OK" />
    </p>
    <ul id="savedData">
    </ul>
</form>
</body>
</html>
Was it helpful?

Solution

You needed to declare the dbo variable outside of the OnLoadCallback function. Also, more currently you would have to update the syntax for the openDatabase call.

OTHER TIPS

I guess no one's going to answer this question, so I'll close it out.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top