0

I have a simple form in a jsfiddle here: http://jsfiddle.net/atma88/6zx415bo/

The problem is that it doesn't delete the record it adds.

I add list item with call to the javascript deleteRecord like this:

function showRecords() {
    results.innerHTML = '';
    db.transaction(function(tx) {
        tx.executeSql(selectAllStatement, [], function(tx, result) {
            dataset = result.rows;
            for (var i = 0, item = null; i < dataset.length; i++) {
                item = dataset.item(i);
                results.innerHTML += '<li>' + item['lastName'] + ' , ' + item['firstName'] + ' <a href="#" onclick="loadRecord(' + i + ')">edit</a>  ' + '<a href="#" onclick="deleteRecord(' + item['id'] + ');">delete</a></li>';
            }
        });
    });
}

My delete record function looks like this:

function deleteRecord(id) {
    alert('it deleted');
    db.transaction(function(tx) {
        tx.executeSql(deleteStatement, [id], showRecords, onError);
    });
    resetForm();
}

When I click the delete link I get the javascript error: Uncaught ReferenceError: deleteRecord is not defined

Barmar
  • 741,623
  • 53
  • 500
  • 612
Atma
  • 29,141
  • 56
  • 198
  • 299
  • 1
    Change the jsfiddle menu from `onLoad` to one of the `No Wrap` choices. – Barmar Sep 16 '15 at 19:38
  • 1
    When you use `onLoad`, everything is inside a function, and `onclick` attributes are run in the global scope. – Barmar Sep 16 '15 at 19:39
  • 1
    But it would be better if you didn't use `onclick` attributes in the first place. Bind your event handlers using jQuery delegation with `.on()`. – Barmar Sep 16 '15 at 19:39

1 Answers1

0

@Barmar was right. Setting the JSFiddle to "no wrap in body" did the trick.

Atma
  • 29,141
  • 56
  • 198
  • 299