Создайте раскрывающийся фильтр на веб-странице, который может читать файл .csv и заполнять раскрывающееся меню. - PullRequest
0 голосов
/ 09 мая 2020

Небольшой контекст: Я работаю в совершенно другом отделе, чем веб-разработка, но мой текущий проект требует, чтобы я сделал веб-страницу. Я новичок в веб-разработке и имею только базовое c представление о HTML и CSS.

Что нужно сделать? : Я создал веб-страницу и Мне нужно разместить на веб-странице раскрывающийся фильтр, который должен быть заполнен данными только из одного столбца в файле .csv, который хранится локально в P C. В столбце будут повторяющиеся записи, но мне нужно, чтобы в раскрывающемся фильтре отображались только отдельные записи.

Небольшое исследование привело меня к осознанию того, что мне нужно создать API, используя node.js. Я не знаком с node.js, не говоря уже о создании API. Я надеюсь, что кто-то, должно быть, делал это раньше, и я был бы благодарен, если бы кто-нибудь сказал мне, где и как мне начать и как это сделать.

1 Ответ

1 голос
/ 09 мая 2020

Node.js - хороший способ решить эту проблему. Как правило, было бы неплохо начать с чтения введения .

На самом деле, на большинство вопросов, которые вам понадобятся, уже может быть дан ответ в Stack Overflow, так что вот только краткое описание :

Прежде всего, вам нужно будет открыть свой csv с помощью включенного модуля файловой системы .

После того, как вы получите csv в виде массива, превратите этот столбец в массив:

csv.split('\n').map(v => v[ columnNumber ]);

Затем вы выводите этот массив.

Последнее, что нужно сделать, это динамически сгенерировать раскрывающийся список, который довольно прост - вперед - просто используйте for-l oop, но выясните это сами. Чтобы включить его в интерфейс, например, поместите html всего интерфейса во внешний файл и включите заполнитель (например, {dropdown}), выберите его с помощью fs, а затем замените заполнитель:

webAppString.replace('{dropdown}', generatedDropdownHtml);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...