Evento de sucesso do Ajax não está funcionando

193

Eu tenho um formulário de registro e estou usando $.ajaxpara enviá-lo.

Este é o meu pedido AJAX:

$(document).ready(function() {
    $("form#regist").submit(function() {
        var str = $("#regist").serialize();
        $.ajax({
            type: 'POST',
            url: 'submit1.php',
            data: $("#regist").serialize(),
            dataType: 'json',
            success: function() {
                $("#loading").append("<h2>you are here</h2>");
            }        
        });
        return false;        
    });
});

No meu arquivo submit1.php , verifico a existência de campos de endereço de email e nome de usuário no banco de dados. Desejo exibir uma mensagem de erro se esses valores existirem sem uma atualização da página .

Como posso adicionar isso ao retorno de chamada bem- sucedido da minha solicitação AJAX?

codingbbq
fonte
2
Tem certeza de que o retorno de chamada bem-sucedido foi chamado?
rahul
Você precisa fazer uma nova pergunta para o seu segundo problema.
Mike Lyons

Respostas:

386

O resultado provavelmente não está no formato JSON; portanto, quando o jQuery tenta analisá-lo como tal, ele falha. Você pode capturar o erro com a error:função de retorno de chamada.

Você parece não precisar de JSON nessa função de qualquer maneira, portanto, você também pode remover a dataType: 'json'linha.

Tatu Ulmanen
fonte
14
Eu mudei o dataType para texto e o fiz funcionar. como estedataType:'text'
Magesh
+1 até o meu, mas em código que não era meu, eu resolvido por retornar dados JSON de servidor
albanx
4
Isso também pode ocorrer se a dataType:não for especificado, mas url:terminar .json.
precisa saber é o seguinte
1
Também em $.postnome alternativo de fornecimento jsoncomo tipo de dados sem json real vindo de servidor não aciona successcallback
Baldrs
Se você deseja fazer uma solicitação json ajax, verifique se o tipo mime está definido como application / json. Isso me deu alguns problemas.
Gellweiler
19

Embora o problema já esteja resolvido, acrescento isso na esperança de ajudar outros.

Cometi o erro e tentei usar uma função diretamente assim (sucesso: OnSuccess (productID)). Mas você precisa passar uma função anônima primeiro:

  function callWebService(cartObject) {

    $.ajax({
      type: "POST",
      url: "http://localhost/AspNetWebService.asmx/YourMethodName",
      data: cartObject,
      contentType: "application/x-www-form-urlencoded",
      dataType: "html",
      success: function () {
        OnSuccess(cartObject.productID)
      },
      error: function () {
        OnError(cartObject.productID)
      },
      complete: function () {
        // Handle the complete event
        alert("ajax completed " + cartObject.productID);
      }
    });  // end Ajax        
    return false;
  }

Se você não usar uma função anônima como um wrapper, o OnSuccess será chamado mesmo se o serviço da web retornar uma exceção.

js newbee
fonte
5
isso não tem nada a ver com ajax, nem jquery, nem manipuladores. Poderíamos também ter um comentário lembrando que "todo o código deve ser envolvido em uma tag de script". A explicação é falsa: você não precisa agrupar nada em funções anônimas, uma função nomeada funcionará, desde que você a passe em vez de chamá-lo. Além disso, é enganoso: o OnSuccess é chamado antes mesmo da solicitação ser enviada, portanto, não faz sentido relacioná-lo ao serviço da Web que retorna algo.
precisa saber é o seguinte
Esta resposta me ajudou, mas eu não votei novamente, você deve atualizar sua resposta de acordo com o comentário @fdreger.
Ozair Kafray
15

Tentei remover a linha dataType e não funcionou para mim. Eu resolvi o problema usando "complete" em vez de "success" como retorno de chamada. O retorno de chamada de sucesso ainda falha no IE, mas, como meu script é executado e concluído de qualquer maneira, é com isso que eu me importo.

$.ajax({
    type: 'POST',
    url: 'somescript.php',
    data: someData,
    complete: function(jqXHR) {
       if(jqXHR.readyState === 4) {
          ... run some code ... 
       }   
    }        
 });

no jQuery 1.5, você também pode fazê-lo assim.

var ajax = $.ajax({
    type: 'POST',
    url: 'somescript.php',
    data: 'someData'
});
ajax.complete(function(jqXHR){
    if(jqXHR.readyState === 4) {
        ... run some code ... 
    }
});
Allen
fonte
9
Apenas uma nota para isso. completesempre será chamado, independentemente se a chamada ajax foi bem-sucedida ou não, e successsomente será chamado se o servidor da web responder com um 200 OKcabeçalho HTTP (está tudo bem).
katalin_2003 30/09
10

Certifique-se de não imprimir (eco ou imprimir) qualquer texto / dados antes de gerar seus dados formatados em JSON em seu arquivo PHP. Isso poderia explicar que você recebe 200 OK, mas seu evento de sucesso ainda falha no seu javascript. Você pode verificar o que seu script está recebendo, verificando a seção "Rede - Resposta" no firebug para o POST submit1.php.

Delfin
fonte
Isso realmente me ajudou. Eu sei que é uma resposta antiga, mas era exatamente o problema que eu estava tendo. Usando eco ou print_r durante a depuração e descobrindo que eles realmente causam o bug ... :) Obrigado!
lennyklb
6 anos depois e ainda ajudando as pessoas com esta resposta! Eu não saberia onde procurar de outra maneira.
Tania Rascia
5

Coloque um alert()no seu successretorno de chamada para garantir que ele esteja sendo chamado.

Caso contrário, é simplesmente porque a solicitação não foi bem-sucedida, mesmo que você consiga acessar o servidor. Causas razoáveis ​​podem ser que um tempo limite expire, ou algo no seu código php lança uma exceção.

Instale o complemento do firebug para o firefox, se você ainda não o fez, e inspecione o retorno de chamada AJAX. Você poderá ver a resposta e se ela recebe ou não uma resposta bem-sucedida (200 OK). Você também pode colocar outro alert()no complete retorno de chamada, que definitivamente deve ser chamado.

David Hedlund
fonte
Obrigado pela sua resposta. Tentei alerta em evento de sucesso, mas não funcionou. Eu tenho o addon do firebug para o firefox e ele recebe uma resposta bem-sucedida (200 OK), portanto não há problemas. Eu tenho uma função die chamada no meu arquivo php por quaisquer erros e quando eu o verifico no firebug, ele mostra a resposta adequada. o que você quer dizer com "Você também pode colocar outro alerta () no retorno de chamada completo, que definitivamente deve ser chamado". Muito obrigado por uma resposta rápida
codingbbq
2
se você não vir o alerta no seu success, não será um sucesso. como a resposta é 200 OK, a resposta de Tatu parece razoável, mas, para solucionar problemas adicionais, você pode usar outro evento, chamado completesempre invocado, independentemente de uma solicitação ter ou não êxito (success apenas acontece se a solicitação for bem-sucedida). complete: function (xhr, status) { alert('complete: '+status); }
David Hedlund
3

Eu tive o mesmo problema. isso acontece porque o tipo de dados javascriptesperado é jsonretornado. mas se você usa eco ou imprime no seu php, esta situação ocorre. se você usar a echofunção phppara retornar dados, basta remover o dataType : "json"trabalho muito bem.

Assim é Wickramasinghe
fonte
2

Eu estava retornando JSON válido, obtendo uma resposta de 200 no meu retorno de chamada "completo" e podia vê-lo no console da rede chrome ... MAS eu não havia especificado

dataType: "json"

uma vez eu fiz, ao contrário da "resposta aceita", que realmente corrigiu o problema.

sarink
fonte
1

Estou usando XML para levar o resultado de volta do php no servidor para a página da web e tive o mesmo comportamento.

No meu caso, o motivo foi o fato de a marca de fechamento não corresponder à marca de abertura.

<?php
....
header("Content-Type: text/xml");
echo "<?xml version=\"1.0\" encoding=\"utf-8\"?>
    <result>
        <status>$status</status>
        <OPENING_TAG>$message</CLOSING_TAG>
    </result>";
?>
thowa
fonte
1

Eu tive esse problema usando uma função ajax para recuperar a senha do usuário do Magento. O evento de sucesso não estava sendo disparado, então percebi que havia dois erros:

  1. O resultado não estava sendo retornado no formato JSON
  2. Eu estava tentando converter uma matriz para o formato JSON, mas essa matriz tinha caracteres não utf

Portanto, toda vez que eu tentava usar json_eoncde () para codificar a matriz de retorno, a função não estava funcionando porque um de seus índices possuía caracteres não utf, a maioria deles acentuando as palavras em português do Brasil.

Andresa Martins
fonte
1

Eu tentei retornar a string do controlador, mas por que o controle retornando ao bloco de erro não foi bem-sucedido no ajax

var sownum="aa";
$.ajax({
    type : "POST",
    contentType : 'application/json; charset=utf-8',
    dataType : "JSON",
    url : 'updateSowDetails.html?sownum=' + sownum,
    success : function() {
        alert("Wrong username");
    },
    error : function(request, status, error) {

        var val = request.responseText;
        alert("error"+val);
    }
});
user7285134
fonte
1

Eu enfrentei o mesmo problema ao consultar o controlador que não retorna resposta de sucesso, quando modificado meu controlador para retornar o problema da mensagem de sucesso foi resolvido. note usando o framework Lavalite. antes:

public function Activity($id)
    {
        $data=getData();
        return
            $this->response->title('title')
                ->layout('layout')
                ->data(compact('data'))
                ->view('view')
                ->output();
    }
after code looks like:
    try {
            $attributes = $request->all();
            //do something
            return $this->response->message('')
                ->code(204)
                ->status('success')
                ->url('url'. $data->id)
                ->redirect();
        } catch (Exception $e) {
            return $this->response->message($e->getMessage())
                ->code(400)
                ->status('error')
                ->url('nothing Wrong')
                ->redirect()
        }

isso funcionou para mim

masokaya
fonte
1

Eu tive o mesmo problema que resolvi dessa maneira: Meu ajax:

event.preventDefault();
$.ajax('file.php', {
method: 'POST',
dataType: 'json',
contentType: 'application/json',
data: JSON.stringify({tab}), 
success: function(php_response){
            if (php_response == 'item') 
                {
                    console.log('it works');
                }
            }
        })

Está bem. O problema não está no json, mas apenas na resposta php. Antes: minha resposta php foi:

echo 'item';

Agora:

$variable = 'item';
 echo json.encode($variable);

Agora meu sucesso está funcionando. PS. Desculpe se algo está errado, mas é o meu primeiro comentário neste fórum :)

silkykg
fonte
0

no meu caso, o erro foi este no lado do servidor e, por esse motivo, estava retornando um html

wp_nonce_field(basename(__FILE__), "mu-meta-box-nonce");
Emiliano Barboza
fonte
0

Adicione retorno de chamada 'error' (assim como 'success') desta maneira:

$.ajax({
   type: 'POST',
   url: 'submit1.php',
   data: $("#regist").serialize(),
   dataType: 'json',
   success: function() {
      $("#loading").append("<h2>you are here</h2>");
   },
   error: function(jqXhr, textStatus, errorMessage){
      console.log("Error: ", errorMessage);
   }
});

Então, no meu caso, eu vi no console:

Error:  SyntaxError: Unexpected end of JSON input
  at parse (<anonymous>), ..., etc.
Vlado
fonte
0

Você deve declarar êxito e retorno de chamada de erro. Adicionando

error: function(err) {...} 

deve corrigir o problema

JeffNhan
fonte
-4

O retorno de chamada de sucesso leva dois argumentos:

success: function (data, textStatus) { }

Verifique também se submit1.phpdefine o cabeçalho do tipo de conteúdo apropriado:application/json

Darin Dimitrov
fonte
Obrigado pela sua resposta. Eu li sobre isso na documentação do jquery ajax, mas não consigo descobrir qual deve ser o meu próximo passo para fazê-lo funcionar ... apreciaria se você pudesse me indicar a direção certa. Também significa que eu deveria ter algum código específico no meu arquivo php? muito obrigado
codingbbq
7
o fato de ter successdois argumentos parece completamente irrelevante para a questão. Você pode passar qualquer quantidade de parâmetros para uma função javascript, independentemente de quantos ele aceita em sua declaração, então essa definitivamente não é a causa desses problemas e, como nenhum dos valores dataou textStatusestá sendo usado no retorno de chamada bem-sucedido, parece haver não há uma boa razão para declará-los na função.
22630 David Hedlund
E os dados JSON não precisam ter o cabeçalho do tipo de conteúdo correto, apenas o formato JSON.
Tatu Ulmanen