jQuery - phonebook
http://stackoverflow.com/questions/33206183/how-to-delete-element-from-list-in-jquery
HTML
<div id="container">
<label>Name</label>
<input type="text" id="nameEdit">
<label>Number</label>
<input type="number" id="numberEdit">
<button id="addItem">Add</button>
<ul id="phonelist"></ul>
</div>
JavaScript
function Phonebook() {
this.phoneBookArray = [];
var defaultvalue = [{
name: "abc",
phonenumber: 989123
}, {
name: "pqr",
phonenumber: 9891462
}]
this.phoneBookArray = defaultvalue;
console.log(this.phoneBookArray)
}
Phonebook.prototype.addItem = function (username, phoneNumber) {
this.phoneBookArray.push({
name: username,
phonenumber: phoneNumber
})
this.displayItem();
}
Phonebook.prototype.displayItem = function () {
$("#phonelist").html('');
for (var i = 0; i < this.phoneBookArray.length; i++) {
$("#phonelist").append('<li><span>' + this.phoneBookArray[i].name + '</span><span>' + this.phoneBookArray[i].phonenumber + '</span><span><button class="del" data-phone=' + this.phoneBookArray[i].phonenumber + '>delete</button></span><span><button class="update" data-phone=' + this.phoneBookArray[i].phonenumber + '>update</button></span></li>')
}
}
Phonebook.prototype.deleteItem = function (index) {
this.phoneBookArray.splice(index, 1);
this.displayItem();
}
Phonebook.prototype.updateItem = function (index, data) {
this.phoneBookArray[index] = {
name: data[0],
phonenumber: data[1]
};
this.displayItem();
}
Phonebook.prototype.findIndex = function (phone) {
var index;
for (var i = 0, length = this.phoneBookArray.length; i < length; i++) {
if (this.phoneBookArray[i].phonenumber == phone) {
index = i;
break;
}
}
return index;
}
var phonedir = new Phonebook();
phonedir.displayItem();
$('#addItem').click(function () {
var name = $('#nameEdit').val();
var phone = $('#numberEdit').val();
if (name != '' && phone != "") {
phonedir.addItem(name, phone);
$('#nameEdit').val('');
$('#numberEdit').val('');
} else {
alert('please enter number and name')
}
})
$(document).on('click', '.del', function () {
var phone =...