Загрузить содержимое локального файла без обновления страницы

Question

У меня есть страница в моем веб-потоке, где я хочу загрузить файл, не обновляя страницу. Я попытался использовать для этого вызов Ajax, но не смог. Я не мог понять, как отправить данные в загруженном файле на серверную/заднюю часть для дальнейшей обработки. Я использую среду Spring MVC, и я не хочу использовать PHP.

Может ли кто-нибудь предложить решение или образец кода, с помощью которого я могу выполнить свою работу? Я очень новичок в JavaScript. более

Одно я должен вернуться на ту же страницу после перехода на стороне сервера, чтобы обработать загруженный файл и вернуться к той же странице со строкой с сервера side.all это происходит без обновления текущей страницы

Любое предложение будет высоко оценено.

Answer 1

Предполагая, что вы уже создали форму и серверный контроллер, настроенный для обработки загрузки, этот небольшой фрагмент должен получить вас на пути к обновлению файла AJAX-y без обновления!

//create a new FormData reference 
//(note: you could use getElementById or querySelector) 
var myForm = document.forms.myUploadForm; 
var fd = new FormData(myForm); 

//create and open an XHR 
var xhr = new XMLHttpRequest(); 
xhr.open("POST","http://www.example.url/the/path/to/your/upload/controller"); 

//set up event listeners (optional) 
xhr.onreadystatechange = monitorStatusFunction; 
xhr.onprogress = updateProgressBarFunction; 

//send the form (w/ no page refresh!) 
xhr.send(fd); 

Answer 2

Я Боролся за много много дней, и, наконец, я понял, решение, которое не может быть лучшим решением, но я отправляю его здесь, так что кто-то, как я могу получить помощь от этого ..

Чтобы удовлетворить все мои требования

Я открыл страницу jsp как всплывающее окно с моей страницы jsp, и с этой страницы я приземлился на свой контроллер и выполнил свою работу на стороне сервера и вернул строку в зависимости от содержимого файла загружен на ту же самую всплывающую страницу, и из всплывающего окна я передал эту строку на родительскую страницу.

Поэтому моя работа выполняется без обновления страницы ... шаги, чтобы сделать это 1.open всплывающее окно, как следовать

window.open («// URL на JSP странице, чтобы открыть», '// somename', '// свойства всплывающей страницы');

2.land на вашем контроллере из всплывающего окна и вернуться на ту же страницу jsp со строкой, которую я хочу со страницы jsp. 3.Вставьте эту строку на родительскую страницу следующим образом.

window.open.urparentjspfuntion (valuefromcontroller);

4.in родительская страница определяет функцию, чтобы сделать то, что вы хотите .....

Я надеюсь, что это решение может помочь так тех, кто, как и я ...