Обернуть текст загруженных файлов и отобразить их в списке - PullRequest
0 голосов
/ 02 мая 2020

Добрый день. У меня два вопроса. Я использую Bootstrap Компоненты материала.

  1. Существует форма для загрузки нескольких файлов, но возникла проблема: при загрузке нескольких файлов текст файлов выходит за пределы поля, как это исправить? Если это невозможно, то как убрать их отображение и сделать как указано в вопросе 2.

  2. Как вывести эти файлы в виде списка под полем?

Моя форма:

<form action="/projects/project/${project.projectId}/stage/${stage.stageId}/team/${team.teamId}/answer/${answer.answerId}/create?${_csrf.parameterName}=${_csrf.token}"
                              method="post" enctype="multipart/form-data">

                            <!-- CSRF Token -->
                            <input type="hidden" name="_csrf" value="${_csrf.token}"/>

                            <!-- Captain Answer -->
                            <div class="form-group">
                                <label for="answerText">You answer</label>
                                <textarea id="answerText" name="answerText"
                                          class="md-textarea form-control ${(answerTextError??)?string('is-invalid', '')}"
                                          rows="5">${answer.answerText!''}</textarea>
                                <#if answerTextError??>
                                    <div class="invalid-feedback">
                                        ${answerTextError}
                                    </div>
                                </#if>
                            </div>

                            <div class="form-group">
                                <label for="projectTheoreticalLeadTime">Answer files</label>
                                <div class="custom-file">
                                    <input type="file" multiple="multiple" id="file" name="files[]"
                                           class="custom-file-input"
                                           aria-describedby="file">
                                    <label class="custom-file-label" for="file" data-browse="Choose">Choose files</label>
                                </div>
                            </div>

                            <div class="text-center mt-4">
                                <button class="btn btn-unique btn-md" type="submit">Send</button>
                            </div>

                        </form>

Снимок экрана:

enter image description here

...