Новая строка не работает с jspdf и результат переопределяется - PullRequest
0 голосов
/ 01 октября 2019

При отправке формы будут сгенерированы данные Json. Я хочу преобразовать их в PDF. Я использую jspdf, почти все работает нормально, за исключением каждого ключа и значения json или не рендеринга в новой строке. Я переосмыслил некоторые решения как "\ n". Он работает, когда он хранится по отдельности, но не внутри цикла "for". Любые предложения и ссылки будут высоко оценены. Заранее спасибо

<form class="form" id="formOne" method="post">
  <input type="text" name="firstname" id="firstname"><br>
  <input type="text" name="lastname" id="lastname"><br>
  <button type="submit" value="submit" id="submitOne"> add </button>
  <br>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
</script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js"></script>

 <script type="text/javascript">
   var json = {}
   function ConvertFormToJSON(form) {
   var array = $(form).serializeArray();
   $.each(array, function() {
   json[this.name] = this.value || '';
 });
 return json;
}


  $(document).ready(function() {
  $(".form").on("submit", function(e) {
   e.preventDefault();
   var jsonArray= ConvertFormToJSON(this);
   var doc = new jsPDF();
   doc.text(20, 30 + (10), jsonArray['firstname']+"\n"+jsonArray['lastname']);//working
   for (var key in jsonArray) {
   doc.text(20, 30 + (10), key+"\n"+jsonArray[key]+"\n");//not working
   }
    doc.save('Test.pdf');
    });
  });
  </script>

в файле pdf результат был переопределен

1 Ответ

0 голосов
/ 01 октября 2019

Я нашел решение, увеличив значение координаты y на каждой итерации цикла. функция doc.text () принимает координаты x и y в качестве параметров. Решение будет

            var i=1;
            var doc = new jsPDF();
              for (var key in jsonArray) {
                     i++;
                     doc.text(10, (i*10) + (10), key + ":" + jsonArray[key]+"\n");
              }
...