Заполнение текстовой области входным файлом - jquery

РЕДАКТИРОВАТЬ Вкратце мой JSP выглядит так:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script src="../js/jquery/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/jquery/jquery-ui.min.js"></script>
<script src="../js/jquery/jquery.validate.min.js" type="text/javascript"></script>
<script src="../js/myJs.js" type="text/javascript"></script>
<script src="../js/loadText.js" type="text/javascript"></script>
<link href="../css/jquery/jquery-ui.css" rel="stylesheet" type="text/css">
<link href="../css/jquery/jquery-ui.theme.min.css" rel="stylesheet" type="text/css">
<link href="../css/jquery/jquery-ui.min.css" rel="stylesheet" type="text/css">
<link href="../css/jquery/jquery-ui.structure.css" rel="stylesheet" type="text/css">
<link href="../css/jquery/jquery-ui.structure.min.css" rel="stylesheet" type="text/css">
<link href="../css/jquery/jquery-ui.theme.css" rel="stylesheet" type="text/css">
<link href="../css/form/form.css" rel="stylesheet" type="text/css">
<title>Add</title>
</head>
<body>
<form:form  modelAttribute="add" method="POST" name="add" action="${pageContext.request.contextPath}/add/myForm" id="myForm">
  <fieldset>
    <legend>Insert new:</legend>
      <div id="id" class="element">
        <label>ID:</label><br/>
            <form:input path="id"/>
      </div>
      <div id="title" class="element">
        <label>*Title:</label><br/>
            <form:input path="title" required="required"/>
      </div>
      <div id="shortDescr" class="element">
        <label>*Short Description:</label><br/>
            <form:textarea path="shortDescr" rows="4" cols="50" required="required"/>
      </div>
      <div id="description" class="element">
        <label>Description:</label>
        <input type="file" value="Upload" id="file" accept=".txt"/><input type='button' id='load-file' value='Load'><br/>
            <form:textarea path="description" rows="4" cols="50" placeholder="description"/>
      </div>
      <br/>
      <br/>
      <br/>
      <br/>
        <input type="submit" name="submit" value="Immetti">
        </fieldset>
    </form:form>
</body>
</html>

Другие.js не трогают описание. Форма отправляет данные в контроллер, который оборачивает результат внутри объекта. Я проверяю свою форму с помощью jquery validate следующим образом: Перенаправление в почтовом режиме внутри метода контроллера

В поисках того, как я могу изменить значение textarea, загружая файл, я нашел это крутое решение: получить данные из файла ввода в JQuery и изменить код для моих нужд следующим образом: https://jsfiddle.net/2madvyqb/7/

<input type="file" id="file" accept=".txt"/>
<input type='button' id='load-file' value='Load'>
<div id="file-content"></div>
<textarea id="description" name="description" rows="4" cols="50">
description</textarea>

и в файле js я заменяю результат на

$('textarea#description').text(fr.result);

Он отлично работает в jsfiddle, но он не работает в моем проекте. Я не вижу никаких ошибок в консоли браузера, и мне кажется, что остальные jquery*.js находятся в правильном порядке.

$('textarea#description').val(fr.result);

тоже не работает

Я использую форму весны.

Источник

1 ответ

Решение

Я нашел ответ здесь: /questions/23005350/javascript-code-rabotaet-v-jsfiddle-no-ne-v-brauzere/23005358#23005358 Просто поставьте скрипт перед </body> тег

Источник
Другие вопросы по тегам