Плагин jquery form, без обработки ошибок
Похоже, что в плагине JQuery.Form нет средства обработки ошибок, что очень расстраивает. Несмотря на то, что в документации говорится, что мы можем использовать опции $.ajax, я все равно не могу использовать параметр "ошибка", когда сервер возвращает ошибку, особенно серии 500 и 400. Разве что этот плагин не может обрабатывать какие-либо ошибки вообще с сервера, или это ошибка, и т.д.?
Может кто-нибудь, пожалуйста, скажите мне, как я могу обрабатывать ошибки (400, 500 и т.д.) С помощью этого плагина? Мне нужна ваша помощь... Все, что я хочу, это простая обработка ошибок... Спасибо.
$("#uploadingImg").hide();
var options = {//Define ajax options
type: "post",
target: "#responsePanel",
beforeSend: function(){
$("#uploadingImg").show();
},
complete: function(xhr, textStatus){
$("#uploadingImg").hide();
},
success: function(response, statusString, xhr, $form){
// I know what to do here since this option works fine
},
error: function(response, status, err){
// This option doesn't catch any of the error below,
// everything is always 'OK' a.k.a 200
if(response.status == 400){
console.log("Sorry, this is bad request!");
}
if(response.status == 601){
sessionTimedOut();
}
}
}
$("#polygonUploadForm").submit(function(){
$(this).ajaxSubmit(options); // Using the jquery.form plugin
return false;
});
Ответы
Ответ 1
Плагин формы jQuery обрабатывает ошибки, а документация верна в заявлении, что он может использовать опции $.ajax. Однако есть два режима, в которые будет работать плагин: - нормальная и загрузка файлов. Проблема, с которой вы сталкиваетесь, заключается в том, что вы выполняете загрузку файлов. (Вы не говорите об этом, но у вас есть "#uploadingImg" и "#polygonUploadForm" и, рекурсивная аргументация, у вас возникает эта проблема.)
Об этом обычно говорят, но вы не можете загрузить файл с помощью AJAX. Это обходное решение - использовать iframe. Форма отправляет POST обычный HTTP-запрос и загружает ответ сервера в iframe. Плагин захватывает ответ и вуаля. Поскольку это происходит как обычный HTTP-запрос, правила и поведение $.ajax не применяются (потому что он не используется). Единственное, что может сделать плагин Form - это обработать все, что бы оно ни получилось. В терминах кода загрузка файлов никогда не будет инициировать атрибут "error", назначенный ajaxForm() или ajaxSubmit(). Если вы действительно хотите доказать, что это не запрос AJAX, присоедините обработчик ajaxComplete() к форме (т.е. Полностью не зависит от методов плагина Form). Это также не будет вызвано. Или посмотрите панель Firebug Net- > XHR.
Итак, это - загрузка не является запросом AJAX. Лучшее, что вы можете сделать, это работать в "успешных" или "полных" обратных вызовах ajaxForm()/ajaxSubmit(). Вы ограничены без доступа к фактическому HTTP-коду ответа, но вы можете проверить ответ. Если ответ пуст или вы не ожидаете, вы можете фактически вызвать обратный вызов "error", вызвав xhr.abort()
. Вместо того, чтобы делать "если (хороший ответ) {yay!} Else {oh no!}", Вызов abort() и запуск "ошибки" делает код немного более чистым и более понятным IMHO. Вот пример кода:
$("#uploadForm").ajaxForm({
success: function(response, textStatus, xhr, form) {
console.log("in ajaxForm success");
if (!response.length || response != 'good') {
console.log("bad or empty response");
return xhr.abort();
}
console.log("All good. Do stuff");
},
error: function(xhr, textStatus, errorThrown) {
console.log("in ajaxForm error");
},
complete: function(xhr, textStatus) {
console.log("in ajaxForm complete");
}
});
Плохой ответ будет печатать это в журнале консоли:
[jquery.form] state = uninitialized
"NetworkError: 404 NOT FOUND - http://server/fileupload/"
[jquery.form] state = loading
[jquery.form] isXml=false
in ajaxForm success
bad or empty response
[jquery.form] aborting upload... aborted
in ajaxForm error
in ajaxForm complete
in ajaxForm complete
Я не знаю, почему "полный" обратный вызов запускается дважды - кто-нибудь?
Последнее, прочитайте этот поток, если вы спрашиваете, почему jQuery или плагин Form не могут просто читать HTTP-заголовки iframe.
Ответ 2
Просто выяснилось, что сам плагин jquery.form не обрабатывает ошибку сервера, потому что он не имеет доступа к заголовкам ответов из-за того, как тег file input обрабатывает загрузку файла. Поэтому я думаю, что W3C должен рассмотреть этот неприятный тег, который не только не позволяет вам стилизовать его с помощью CSS, но также не упрощает обработку ответов сервера.
Должен быть способ вокруг него, хотя...
Сообщите мне, если я сказал что-то не так, и дайте мне знать ваши мысли об этом теге ввода файла...
Ответ 3
Плагин JQuery Form обрабатывает успешный статус ответа сервера (код 200), я думаю, что информации достаточно.
С этой точки зрения вы можете создать сервер с сервером ответа
return $this->returnJson(array(
'response' => 'success',//error or whatever
'data' => 'Succesfully saved in the database'
));
конечно, returnJson - это функция отправки данных Json (вы можете создать один или сделать внутри своего метода)
в интерфейсе на дескрипторе успеха (срабатывает при ответе 200) вам просто нужно проверить ваше поле статуса (в данном случае "ответ" ), пример ниже:
var options = {
dataType : 'json',
success: handleResponse
};
function handleResponse (responseText, statusText, xhr, $form){
if(responseText.response == 'success') {
//do something
}else if(responseText.response == 'error'){
//do something
}
}
Ответ 4
В параметрах
var options = {
target: '#output2',
beforeSubmit: showRequest,
success: showResponse,
timeout: 1000
};
в случае ошибки нет триггерного вызова. Плагин просто зависает, когда вы получаете 500 или 404.
Успех действует только на "успех", так что все, что у нас есть на данный момент.
Ответ 5
Для тех, кто все еще нуждается в этом, это способ заставить его работать
function submitForm()
{
var isSuccess = false,
options = {
url : "posturl.php",
type : 'POST',
dataType : 'json',
success:function(msg) {
//set the variable to true
isSuccess = true;
//do whatever
},
complete: function () {
if (isSuccess === false) {
//throw the error message
}
}
};
//Ajax submit the form
$('#your_form').ajaxSubmit(options);
// always return false to prevent standard browser submit and page navigation
return false;
}