Advertisement
ErolKZ

Untitled

Feb 22nd, 2022
28
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.74 KB | None | 0 0
  1.  
  2. function solve() {
  3.  
  4.  
  5. let sendFormElement = document.querySelector('button');
  6.  
  7. sendFormElement.addEventListener('click', (e) => {
  8.  
  9. let inputElements = document.querySelectorAll('#description, #client-name, #client-phone');
  10.  
  11. inputElements = Array.from(inputElements);
  12.  
  13. let arrOfInpEl = inputElements.map(el => el.value);
  14.  
  15.  
  16. if (!arrOfInpEl.includes('')) {
  17.  
  18. let productType = document.getElementById('type-product').value;
  19.  
  20. let clearButtonElement = document.querySelector('.clear-btn');
  21.  
  22. let recvOrdersSection = document.getElementById('received-orders');
  23.  
  24. let compOrdersSection = document.getElementById('completed-orders');
  25.  
  26. let divContainer = document.createElement('div');
  27.  
  28. divContainer.classList.add('container');
  29.  
  30. let h2El = document.createElement('h2');
  31.  
  32. let h3El = document.createElement('h3');
  33.  
  34. let h4El = document.createElement('h4');
  35.  
  36. let buttonStart = document.createElement('button');
  37.  
  38. let buttonFinish = document.createElement('button');
  39.  
  40. buttonStart.textContent = 'Start repair';
  41.  
  42. buttonFinish.textContent = 'Finish repair';
  43.  
  44. buttonStart.classList.add('start-btn');
  45.  
  46. buttonFinish.classList.add('finish-btn');
  47.  
  48. buttonFinish.disabled = true;
  49.  
  50. h2El.textContent = `Product type for repair: ${productType}`;
  51.  
  52. h3El.textContent = `Client information: ${inputElements[1].value}, ${inputElements[2].value}`;
  53.  
  54. h4El.textContent = `Description of the problem: ${inputElements[0].value}`;
  55.  
  56. divContainer.appendChild(h2El);
  57.  
  58. divContainer.appendChild(h3El);
  59.  
  60. divContainer.appendChild(h4El);
  61.  
  62. divContainer.appendChild(buttonStart);
  63.  
  64. divContainer.appendChild(buttonFinish);
  65.  
  66. recvOrdersSection.appendChild(divContainer);
  67.  
  68. for (el of inputElements) {
  69.  
  70. el.value = '';
  71.  
  72. }
  73.  
  74.  
  75. buttonStart.addEventListener('click', (e) => {
  76.  
  77. buttonStart.disabled = true;
  78.  
  79. buttonFinish.disabled = false;
  80.  
  81. });
  82.  
  83.  
  84. buttonFinish.addEventListener('click', (e) => {
  85.  
  86. divContainer.removeChild(buttonStart);
  87.  
  88. divContainer.removeChild(buttonFinish);
  89.  
  90. compOrdersSection.appendChild(divContainer);
  91.  
  92. });
  93.  
  94.  
  95. clearButtonElement.addEventListener('click', (e) => {
  96.  
  97. compOrdersSection.removeChild(compOrdersSection.lastChild);
  98.  
  99. });
  100.  
  101.  
  102. }
  103.  
  104.  
  105.  
  106. event.preventDefault();
  107.  
  108. });
  109.  
  110.  
  111.  
  112. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement