@FilosofMagadan

Js и Pdf как что и почему?

Я ничего почти в этом не понимаю но как-то надо собрать скрипт для pdf документа.
Есть таблица ниже приложена. В ней есть несколько человек в первой графе,есть их профессии вторая графа,есть текущая дата третья графа, и номер инструкции четвёртая. При выборе фамилии должна автоматически выставиться профессия(должность), у меня это получилось сделать но проблема есть когда удаляешь всё из графы,а надо чтобы и в остальных графах всё удалялось. При этом должна выставиться инструкция и текущее время.
Вот что у меня получилось дальше я сообразить не могу

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;
}


5b3e656d7ef67939278861.png
  • Вопрос задан
  • 196 просмотров
Пригласить эксперта
Ответы на вопрос 1
@alexalexes
Если вам нужно сделать таблицу с автозаполнением полей для печати, то в случае веб-реализации вам нужно не начальные, а уверенные знания JavaScript.
Вот примерно так можно это сделать.
<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>
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы