fix bugs

11/script.js

@@ -1,5 +1,6 @@
 //Form
 function Form(el, data, okCallback, cancelCallback){
+    let backUp = {};
     let formBody = document.createElement('div');
     let okButton = document.createElement('button');
     okButton.innerHTML = 'OK';
@@ -11,8 +12,7 @@ function Form(el, data, okCallback, cancelCallback){
     const table = document.createElement('table');
     formBody.append(table);
 
-    let flag = true;
-
+    let flag = false;
     this.validators     = {};
 
     //Отображение
@@ -34,10 +34,10 @@ function Form(el, data, okCallback, cancelCallback){
         if(data[key] === '') {
             inp.style.border = '2px solid #f00';
             td.append(inp);
-            flag = true
+            flag = false;
         } else {
             td.append(inp);
-            flag = false
+            flag = true;
         }
         if (key.slice(0,1) === "*") {
             th.innerHTML = `<strong>${key.slice(1)} <sup style="color: red">*</sup></strong>`;
@@ -53,11 +53,11 @@ function Form(el, data, okCallback, cancelCallback){
         inp.onchange = () => {
             if(data[key] === '') {
                 inp.style.border = '2px solid #f00';
-                flag = true;
+                flag = false;
             }
             else {
                 inp.style.border = '2px solid #000';
-                flag = false;
+                flag = true;
             }
             if (key in this.validators) {
                 if (strError !== '') strError = '';
@@ -65,12 +65,12 @@ function Form(el, data, okCallback, cancelCallback){
                 if (res === true){
                     strError = res.toString();
                     tdError.style.color = '#000';
-                    flag = false;
+                    flag = true;
                 }
                 else {
                     strError = res.toString();
                     tdError.style.color = '#F00';
-                    flag = true;
+                    flag = false;
                 }
                 tdError.textContent = strError;
                 tr.append(tdError);
@@ -79,30 +79,29 @@ function Form(el, data, okCallback, cancelCallback){
     }
     if (typeof okCallback === 'function'){
         formBody.appendChild(okButton);
-        okButton.onclick = (e) => {
-            console.log(this);
-            this.okCallback(e);
+        if (flag === true){
+            okButton.disabled = false;
+            okCallback(data);
+            okButton.onclick = (e) => {
+                console.log(this);
+                this.okCallback(e);
+            }
+        }
+        else {
+            okButton.disabled = true;
         }
     }
     if (typeof cancelCallback === 'function'){
         formBody.appendChild(cancelButton);
-        cancelButton.onclick = cancelCallback;
+        cancelButton.onclick = () => {
+            backUp = {...data};
+            table.remove();
+            cancelCallback();
+        }
     }
 
     el.appendChild(formBody);
-
-    //OkButton
-    this.OkButton = () => {
-        if (flag === false){
-            okCallback(data)
-        }
-    }
-    //CancelButton
-    this.CancelButton = () => {
-        data = null;
-    }
     this.okCallback     = okCallback;
-    //CancelButton
     this.cancelCallback = cancelCallback;
     this.data           = data;
 }
@@ -148,11 +147,11 @@ let form = new Form(formContainer, {
     '*name': 'Anakin',
     surname: 'Skywalker',
     married: true,
-    birthday: new Date((new Date).getTime() - 86400000 * 30*365)
+    birthday: new Date((new Date).getTime() - 86400000 * 30 * 365)
 }, () => console.log('ok'),() => console.log('cancel') )
 form.okCallback = () => console.log('ok2');
 
-form.validators['*surname'] = (value, key, data, input) =>
+form.validators.surname = (value, key, data, input) =>
     value.length > 2 && value[0].toUpperCase() === value[0] && !value.includes(' ')
         ? true : 'Wrong name'
 console.log(form)