PShim

Импорт данных в html форму

Рекомендованные сообщения

Добрый день!
Есть небольшой вопрос связанный с импортом данных в html форму. Постановка задачи такова: есть html форма которая в дальнейшем отправляется на печать, в определенные пункты этой форму нужно импортировать данные из внешнего файла (excel например). Каким образом можно производить передачу данных? Как сделать это по тегово? Какие есть бесплатные библиотеки по js для формирования отчетов?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

если html форма имеет формат (и ни как не связана с php)

<form>
...
<input name="col1">
<input name="col2">
....
</form>

а xls выглядит на вроде
 col1 | col2  
text1 | text2
то можно через js запрашивать с сервера информацию xls файла разбирать данные и вставлять из колонки 'col1' в value input c name="col1" 'text1'.
для работы c xls в php можно использовать библиотеку PHPExcel, о ее работе можно почитать здесь https://habr.com/ru/post/245233/

если есть возможность, то я бы посоветовал перенести формирование формы в php и сразу в этот момент можно было бы заполнять ее данными из xls

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

А пример когда для локального excel с помощью обращения к нему на js можете скинуть?

Изменено пользователем PShim

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

если вы файл берете не с сервера, то лучше импортировать в другом формате, например csv или xml
дальше выбрав его через <input type="file"> получить доступ к его содержимому в этом вам поможет
https://developer.mozilla.org/ru/docs/Web/API/FileReader
и заполнять форму данными

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Простите, не могу понять все равно как. Без примера не разберусь.

html:
<td><input type="file" id="input"></td>

js:

var fileInput = document.querySelector('input[type="file"]');

function read(callback) {

var file = fileInput.files.item(0);

var reader = new FileReader();

reader.onload = function() {

callback(reader.result);

}

reader.readAsText(file);

}

 

Все же прошу помочь как с написанием кода/примером

По факту у меня имеется таблица в html в нее нужно внести определенные данные из csv файла.

Изменено пользователем PShim

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Еще раз здравствуйте. Я все же не могу разобраться с js. Если можете помогите кодом. Есть csv файл, имеющий в себе конструкцию  id| num   и имеется html таблица в которую нужно вывести значения id, num

                                                            21| 45

в определенные секции этой таблицы. Как нужно правильно обратиться к элементам файла csv и вывести в определенные пункты таблицы в html. Помогите кодом!

Изменено пользователем PShim

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

а как можно не правильно обратиться к строкам csv?
какая связь должна быть у "определенных" пунктов в таблице с данными в csv чтобы однозначно понять что именно эти данные должны быть вставлены в конкретную ячейку?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Правильно это когда не знаешь синтаксиса в js. Связь данных csv и таблицы html чисто прикладная. Я понимаю как можно с помощью генератора и работы с json на python сделать подобную работу. Но никак не могу вникнуть, как можно сделать это все на js. Поэтому ищу помощь на этом форуме. 
Связь между данными можно определить как в словаре. {kye:value} и прописать в ручную для каждого значения сначала в js все значения присвоив им переменные, которые в дальнейшем можно вывести в html таблицу в требуемые места по заданию

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

связь то какая?
вот есть у вас csv

Цитата

1;1
2;2
3;3

есть таблица

<table>
<tr><td></td><td></td></tr>
<tr><td></td><td></td></tr>
<tr><td></td><td></td></tr>
</table>

как определить куда вставлять 1, куда 2, куда 3?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

speed;1
weigth;2
tall;3
age;18

 

Если примерно сделать так, то как будет выглядеть код? Вы уроки по js не даете?

<table>
<tr>1<td></td><td></td></tr>
<tr><td></td><td>2</td></tr>
<tr><td></td><td>18</td>3</tr>
</table>

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

1. первая колонка из csv у вас не вставляется и является ключом
2. туда куда вы вставили 1 и 3 нельзя вставлять данные
предположу, что вам нужно
https://jsfiddle.net/9bzwpmya/

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

так сделано под

Цитата

speed;1
weigth;2
tall;3
age;18

а у вас в файле
speed;weigth;tall;age
1;2;3;18
в вашем случае нужно первую строку использовать для создания ключей массива
а вторую значений

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас

  • Похожие публикации

    • Автор: artaka
      Работаю верстальщиком за небольшую плату (100-300руб в зависимости от работы) Связь со мной : 
      VK vk.com/artakagrand
      Telegram @artakagrand
      email fefsert@gmail.com
      Примеры работ:
      http://teslamodelx.epizy.com
      http://teslamodelx.epizy.com/infoblog/index.html
      http://teslamodelx.epizy.com/blog/index.php
    • Автор: ZAMPOREZKE
      Оцените верстку и скажите, что не так.Заранее спасибо.
      https://zamporezke.github.io/
    • Автор: PShim
      Здравствуйте. Подскажите пожалуйста, что стоит дописать в скрипт чтобы файл сохранялся со стилем(css). Есть свой скрипт и есть взятый из jq(https://www.jqueryscript.net/other/Export-Html-To-Word-Document-With-Images-Using-jQuery-Word-Export-Plugin.html). 
      function Export2Doc(element, filename = ''){ var preHtml = "<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>Export HTML To Doc</title></head><body>"; var postHtml = "</body></html>"; var html = preHtml+document.getElementById(element).innerHTML+postHtml; var blob = new Blob(['\ufeff', html], { type: 'application/msword' }); var url = 'data:application/vnd.ms-word;charset=utf-8,' + encodeURIComponent(html); filename = filename?filename+'.doc':'document.doc'; var downloadLink = document.createElement("a"); document.body.appendChild(downloadLink); if(navigator.msSaveOrOpenBlob ){ navigator.msSaveOrOpenBlob(blob, filename); }else{ downloadLink.href = url; downloadLink.download = filename; downloadLink.click(); } document.body.removeChild(downloadLink); }  
  • Сейчас на странице   0 пользователей

    Нет пользователей, просматривающих эту страницу.