Js and Pdf like what and why?

F

FilosofMagadan2018-07-05 21:38:16

JavaScript

FilosofMagadan, 2018-07-05 21:38:16

I almost don’t understand anything about this, but somehow I need to compile a script for a pdf document.
There is a table attached below. It has several people in the first column, there are their professions in the second column, there is the current date in the third column, and the instruction number is the fourth. When choosing a surname, the profession (position) should be automatically set, I managed to do it, but there is a problem when you delete everything from the column, but it is necessary that everything be deleted in the other columns. In this case, the instruction and the current time should be set.
Here's what I got next, I can't figure it out

var user = " "
var user1 = "Иванов И.А."
var user2 = "Петров И.А."
var user3 = "Сидоров И.А."
var prof = " "
var prof1 = "Водитель"
var prof2 = "Техник"
var prof3 = "Инженер"
if(event.value == user) {
this.getField("Text1").value = prof;
} 
if(event.value == user1) {
this.getField("Text1").value = prof1;
} 
if(event.value == user2) {
this.getField("Text1").value = prof2;
} 
if(event.value == user3) {
this.getField("Text1").value = prof3;
}

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

A

alexalexes, 2018-07-06
@alexalexes

If you need to make a table with autocomplete fields for printing, then in the case of a web implementation, you need not initial, but confident knowledge of JavaScript.
Here's how you can do it.

<html>
  <head>
    <meta http-equiv="Content-Type" content='text/html; charset=utf-8'>
  </head>
  <body>
    <style>
      html, body
      {
        margin: 0;
        padding: 0;
      }
      table
      {
        border-collapse: collapse;
        background-color: #fff;
      }
      table,
      table td,
      table th
      {
        border: 1px solid #333;
      }
    </style>
    <table id="job_briefing">
      <tr><th>Работник</th><th>Должность</th><th>Дата инструктажа</th><th>Инструкция</th><th>Подпись</th></tr>
    </table>
    <script>
      (function()
      {
        var row_count = 30; // количество строк таблицы
        var inctruct_info = '№18 от 01.07.2015'; // номер инструкции, которая будет заполнятся автоматически
        // справочник работников
        var workers =
        [
          {                   
            name: 'Иванов И.А.',
            post: 'Водитель'
          },
          {
            name: 'Петров И.А.',
            post: 'Техник'
          },
          {
            name: 'Сидоров И.А.',
            post: 'Инженер'
          },
        ];
        var job_briefing_table = document.getElementById('job_briefing'); // получаем DOM-элемент со страницы
        for(var i = 0; i < row_count; i++)
          job_briefing_table.appendChild(create_table_row()); // наполняем строками
        
        // функция создания строки
        function create_table_row()
        {
          var tr_elem = document.createElement('tr'); // создаем элемент tr
          var td_elem = document.createElement('td'); // создаем элемент td
          td_elem.appendChild(create_select(workers)); // создаем элемент select и вставялем его в td
          tr_elem.appendChild(td_elem); // вставляем td в tr
          for(var i = 0; i < 4; i++) // создаем и вставляем остальные td
          {
            td_elem = document.createElement('td');
            tr_elem.appendChild(td_elem);
          }
          return tr_elem;
        }
        // функция создания выпадающего списка с работниками
        function create_select(workers /* - список работников*/)
        {
          var select_elem = document.createElement('select'); // содаем элемент select
          var worker_count = workers.length; // определяем кол-во работников в списке
          var option_elem = document.createElement('option'); // создаем элемент option
          option_elem.setAttribute('value', -1); // добавляем в option атрибут value для пустого элемента
          select_elem.appendChild(option_elem); // вставляем option в select
          for(var i = 0; i < worker_count; i++) // перебираем список работников
          {
            var worker = workers[i]; // текущий элемент списка работников
            option_elem = document.createElement('option');
            option_elem.setAttribute('value', i); // добавляем в option атрибут value = порядковый номер работника в списке 
            option_elem.innerHTML = worker.name; // имя работника в option
            select_elem.appendChild(option_elem); // вставляем option в select
          }
          select_elem.onchange = worker_select_onchange; // добавляем обработчик события выбора элемента в выпадающем списке работников
          return select_elem; // возвращаем готовый элемент выпадающего списка
        }
        // обработчик события выбора элемента в выпадающем списке работников
        function worker_select_onchange(e)
        {
          var target = e.target; // получаем то элемент select, на котором произошло событие выбора работника
          var select_value = target.value; // получаем выбранное value - порядковый номер работника
          var tr_elem = target.parentNode.parentNode; // получаем строку, на котором располагается select (второй родительский элемент)
          var td_elems = tr_elem.getElementsByTagName('td'); // получаем все ячейки этой строки
          td_elems[1].innerHTML = select_value == -1 ? '' : workers[select_value].post; // задаем должность для 2-ой ячейки
          td_elems[2].innerHTML = select_value == -1 ? '' : get_current_date(); // задаем текущую дату для 3-ей ячейки
          td_elems[3].innerHTML = select_value == -1 ? '' : inctruct_info; // задаем сведения об инструкции для 4-ой строки
        }
        // функция получения текущей даты по формату DD.MM.YYYY
        function get_current_date()
        {
          var date = new Date();
          var day = date.getDate();
          var month = date.getMonth() + 1;   
          return  (day < 10 ? '0' : '') + day + '.'  + (month < 10 ? '0' : '') + month + '.' + date.getFullYear();
        }
      })();
    </script>
  </body>
</html>