homework/module/tableEditor/js/tableEditor.js

// var table = document.createElement("table");
// for (var i = 0; i < persons.length; i++) {
//     tr = document.createElement("tr");
//     var key = Object.keys(persons[i]);
//     for (var c = 0; c < key.length; c++) {
//         if(c < 3)
//             str += "<td>" + key[c] + ": " + persons[i][key[c]] + "</td>";
//         if(c >= 3 && key[c] in persons[i])
//             str += "<td>" + key[c] + ": " + persons[i][key[c]] + "</td>";
//     }
//     str += "</tr>"
// }
// str += "</table>";
// document.write(str);

var a = {
    name: "Ivan",
    surname: "Ivanov",
}
var b = {
    name: "Petr",
    surname: "Petrov",
}
var c = {
    name: "Alex",
    surname: "Sidarov",
}

a.age = 20;
b.fathername = "Nikolai";
c.sex = "male";

var persons = [a,b,c,
    {
        name: "pasha",
        surname: "efimenko",
        age: 22
    }
]




var element = document.createElement("div");
document.body.appendChild(element);
element.setAttribute("id","myId")


var result = tableEditor(element, persons)
console.log(result)

function tableEditor(container, arr){
	
	function dblfunc(){
		
			var cont = document.createElement("input")
			cont.setAttribute("type","text");
			this.innerHTML = "";
			this.appendChild(cont);
			cont.ondblclick = inputDbl;
		
	}
	function inputDbl(){
			
			var val = this.value;
			var objKeyss = Object.keys(arr[this.parentElement.parentElement.rowIndex]);
			if(!(this.parentElement.cellIndex % 2)){
				arr[this.parentElement.parentElement.rowIndex][val] = this.parentElement.nextSibling.innerHTML;
				if(this.parentElement.cellIndex === 0)
					delete(arr[this.parentElement.parentElement.rowIndex][objKeyss[this.parentElement.cellIndex]]);
				else
					delete(arr[this.parentElement.parentElement.rowIndex][objKeyss[this.parentElement.cellIndex - 1]]);
			}
			if(this.parentElement.cellIndex % 2 > 0)
				arr[this.parentElement.parentElement.rowIndex][objKeyss[(this.parentElement.cellIndex - 1)/2]] = val;
			this.parentElement.ondblclick = function(){};
			this.parentElement.innerHTML = val;
			console.log(arr);
			this.parentElement.removeChild(this); 
				console.log(arr);
		}
	
	var table = document.createElement("table");
	for (var i = 0; i < arr.length; i++) {
		var tr = document.createElement("tr");
		for (var j = 0; j < 3; j++) {
			var td1 = document.createElement("td");
			var td2 = document.createElement("td");
			var objKeys = Object.keys(arr[i])
			td1.innerHTML = objKeys[j] + ": ";
			td2.innerHTML = arr[i][objKeys[j]];
			td1.ondblclick = dblfunc;
			td2.ondblclick = dblfunc;
			tr.appendChild(td1);
			tr.appendChild(td2);
		}
		 table.appendChild(tr);
	}
	container.appendChild(table);
	
	return arr;
}