Question

I’m making a small appwith localstaorage (not implemented yet): you type a note int the text area and it is display in a list

the note are stacked in an object called notes (for localstorage in the future);

But my problem is : I can add a note, but when I try to remove on of them, I have to remove my li and the related note object in the ‘notes’ array, so i decided to use splice method, but it works in a strange way…

when i click ‘close’, it works fine one or two times but at a moment the array stays with one or two object in it…

I tried different ways to solve the problem but without success…

Here is the fiddle : http://jsfiddle.net/h8hg6/1/

thanks for your help

Answer 1

I have made some modifications to your fiddle that I think solve the problem. Essentially you were using .splice incorrectly, and your Array was falling out of sync with your note elements. I’ve replaced your array with an numeric-based object because it is much easier to deal with. Here are some of the relevant changes:

http://jsfiddle.net/h8hg6/2/

var notes = {}; // notes is now an object instead of an array
// snip

var number = jQuery(this).parents('li').data('number');
delete notes[number]; // this is how you remove properties from an object

// snip
var note = {
    color: color,
    text: text
};

notes[i] = note; // add this object as a property of the notes object
i++;