У меня есть html-форма, используемая для загрузки файла на сервер. Для краткости я показал только основные точки
<form id='uploadform' method='post' enctype='multipart/form-data' action='index.php/upload'> <input name='myFile' id='myFile' type='file'/> </form> <input type='button' id='upload' value='Upload'/> <div id='response'></div> Я использую jQuery.submit () для отправки формы:
$('#uploadform').submit();
Бизнес-логика – это Slim PHP: $ app-> post ('/ upload', 'uploadFile'); ….
function uploadFile(){ try{ // if success uploading $app->redirect('/main-page'); }catch(Exception $e){ // if error echo $e->getMessage(); } }
Проблема. Если загрузка по какой-либо причине не выполняется, генерируется исключение, пользователь переходит на страницу ошибок PHP. Если загрузка завершена без исключения, приложение перенаправляется на главную страницу.
Требуется следующее: если загрузка успешно завершена, приложение должно быть перенаправлено на главную страницу, как и сейчас … но если возникло какое-либо исключение, вместо перехода на страницу ошибок PHP, приложение должно оставаться на странице загрузки и с помощью id = 'response' должен отображать исключение.
Можно ли сделать что-нибудь подобное с помощью jQuery submit ():
$('#uploadform').submit(function(response){ $('response').html(response); });
????
Я знаю, что плагины для загрузки файлов JQuery облегчат жизнь … но это не вариант для меня …
Спасибо за любые указатели!
Является ли это возможным
Вы должны использовать ajax, вот пример для загрузки файла с помощью ajax
Отправка multipart / formdata с помощью jQuery.ajax
с помощью ajax вы можете перенаправить обратно пользователя и отправить текст ошибки методом GET и поместить этот текст в тег ответа
У меня была аналогичная проблема в прошлом, то, что я придумал, – использовать invisble iframe для публикации загрузки файла и получения результата html, надеюсь, что это поможет!
Я думаю, это то, что вы ищете
html-код:
<form id='uploadform' method='post' enctype='multipart/form-data' action='index.php/upload' target="hiddeniframe"> <input name='myFile' id='myFile' type='file'/> </form> <iframe name="hiddeniframe" id="hiddeniframe" style="display: none"></iframe> <input type='button' id='upload' value='Upload'/> <div id='response'></div>
Я добавил скрытый iframe и сделал целью формы идентификатор iframe. Это сделает форму отправленной в iframe, чтобы вся страница не перезагружалась
Код javascript:
<script type="text/javascript"> window.showUploadError = function(error) { $('#response').html(error); }; $('#uploadform').submit(); </script>
Я добавил глобальную функцию с именем showUploadError, которая будет вызываться из функции загрузки php в случае ошибки
PHP-код
<?php function uploadFile(){ try{ // if success uploading ?> <script type="text/javascript"> parent.location.href = '/main-page' </script> <?php die(); }catch(Exception $e){ // if error ?> <script type="text/javascript"> parent.showUploadError('Upload failed'); </script> <?php } }
если загрузка прошла успешно, мы выводим некоторый код javascript, который перенаправляет родительскую страницу (главную страницу) на новое местоположение, иначе она вызовет функцию showUploadError javascript.
Имейте в виду, что это грубый пример, и я его не тестировал.
У вас есть опция «отправить» в «iframe», а затем «js» получит ответ. В PHP вы отправляете сообщение, которое затем интерпретируется в «JS».
HTML:
<form id="uploadform" method="post" enctype="multipart/form-data" action="index.php/upload" target="uploadformResponse"> <input name='myFile' id='myFile' type='file'/> </form> <input type='button' id='upload' value='Upload'/> <div id='response'></div> <div style="display:none;"> <iframe name="uploadformResponse" id="uploadformResponse"></iframe> </div>
Javascript:
var runSubmitForm = function() { var $iframe = $('#uploadformResponse'), fnLoadIframe = function(event) { $iframe.unbind('load'); var response = $iframe.contents(), aresponse = response.split('|'); console.log('debug respnse', response); if (aresponse.length != 2) { $('#response').html("Error I ???"); } if (aresponse[0] == '1') { window.location = aresponse[1]; } else if (aresponse[0] == '0') { $('#response').html(aresponse[1]); } else { $('#response').html("Error II ???"); } }; $iframe.bind('load', fnLoadIframe); $('#uploadform').submit(); };
PHP:
function uploadFile(){ try{ // if success uploading echo '1|/main-page'; } catch(Exception $e) { // if error echo '0|' . $e->getMessage(); } exit; // optional }