Jak uzyskać odpowiedź z formularza przesłanego przez AJAX?

Question

Chcę używać Aymymailing Joomla! Komponent instalowany na example.com/mailer zarządzać subskrypcji z witryny non Joomla na example.com

W tym przypadku mam prosty skrypt

$(function() { 
    $('form').on('submit', function (e) { 
     e.preventDefault(); 
     $.ajax({ 
     type: 'post', 
     url: 'https://example.com/mailer/index.php?option=com_acymailing&ctrl=sub', 
     data: $('form').serialize(), 
     success: function() { 
      swal('Great success!'); 
     } 
     }); 
    }); 
    }); 

i formę

<form class="form-inline" action="https://example.com/mailer/index.php?option=com_acymailing&ctrl=sub" method="post"> 
    <div class="form-group"> 
     <label class="sr-only" for="user_name">Email address</label> 
     <input id="user_name" type="text" name="user[name]" value="" class="form-control" placeholder="Email"> 
    </div> 
    <div class="form-group"> 
     <label class="sr-only" for="user_email">Password</label> 
     <input id="user_email" type="text" name="user[email]" value="" class="form-control" placeholder="Password"> 
    </div> 
    <button type="submit" class="btn btn-default">Sign Up!</button> 
    <input type="hidden" name="user[html]" value="1" /> 
    <input type="hidden" name="acyformname" value="formAcymailing1" /> 
    <input type="hidden" name="ctrl" value="sub"/> 
    <input type="hidden" name="task" value="optin"/> 
    <input type="hidden" name="redirect" value="https://example.com"/> 
    <input type="hidden" name="option" value="com_acymailing"/> 
    <input type="hidden" name="visiblelists" value=""/> 
    <input type="hidden" name="hiddenlists" value="1"/> 
</form> 

Wszystko działa dobrze, z wyjątkiem sukcesu, błędów stwierdza ...

Joomla A cymailing mieć sub.php plik do obsługi ajax odpowiedzi

if($config->get('subscription_message',1) || $ajax){ 
     if($allowSubscriptionModifications){ 
      if($statusAdd == 2){ 
       if($userClass->confirmationSentSuccess){ 
        $msg = 'CONFIRMATION_SENT'; 
        $code = 2; 
        $msgtype = 'success'; 
       }else{ 
        $msg = $userClass->confirmationSentError; 
        $code = 7; 
        $msgtype = 'error'; 
       } 
      }else{ 
       if($insertMessage){ 
        $msg = 'SUBSCRIPTION_OK'; 
        $code = 3; 
        $msgtype = 'success'; 
       }elseif($updateMessage){ 

        $msg = 'SUBSCRIPTION_UPDATED_OK'; 
        $code = 4; 
        $msgtype = 'success'; 
       }else{ 
        $msg = 'ALREADY_SUBSCRIBED'; 
        $code = 5; 
        $msgtype = 'success'; 
       } 
      } 
     }else{ 
      if($modifySubscriptionSuccess){ 
       $msg = 'IDENTIFICATION_SENT'; 
       $code = 6; 
       $msgtype = 'warning'; 
      }else{ 
       $msg = $modifySubscriptionError; 
       $code = 8; 
       $msgtype = 'error'; 
      } 
     } 

     if($msg == strtoupper($msg)){ 
      $source = acymailing_getVar('cmd', 'acy_source'); 
      if(strpos($source, 'module_') !== false){ 
       $moduleId = '_'.strtoupper($source); 
       if(acymailing_translation($msg.$moduleId) != $msg.$moduleId) $msg = $msg.$moduleId; 
      } 
      $msg = acymailing_translation($msg); 
     } 

     $replace = array(); 
     $replace['{list:name}'] = ''; 
     foreach($myuser as $oneProp => $oneVal){ 
      $replace['{user:'.$oneProp.'}'] = $oneVal; 
     } 
     $msg = str_replace(array_keys($replace),$replace,$msg); 

     if($config->get('redirect_tags', 0) == 1) $redirectUrl = str_replace(array_keys($replace),$replace,$redirectUrl); 

     if($ajax){ 
      $msg = str_replace(array("\n","\r",'"','\\'),array(' ',' ',"'",'\\\\'),$msg); 
      echo '{"message":"'.$msg.'","type":"'.($msgtype == 'warning' ? 'success' : $msgtype).'","code":"'.$code.'"}'; 
     }elseif(empty($redirectUrl)){ 
      acymailing_enqueueMessage($msg,$msgtype == 'success' ? 'info' : $msgtype); 
     }else{ 
      if(strlen($msg)>0){ 
       if($msgtype == 'success') acymailing_enqueueMessage($msg); 
       elseif($msgtype == 'warning') acymailing_enqueueMessage($msg,'notice'); 
       else acymailing_enqueueMessage($msg,'error'); 
      } 
     } 
    } 

i JSON wygląda na Joomla rejestracji bocznej do tej samej formie przez opcję index.php = com_acymailing & ctrl = sub

message Subscribe confirmed 
type success 
code 3 

{"message":"Subscribe confirmed","type":"success","code":"3"} 

Pytanie to: jak uzyskać to zgłoszenie statusy sukcesu, błędu, już przesłanego itp. na zewnętrznym formularzu zgłoszeniowym (na stronie example.com strona)?

Answer 1

nie czuję Twój ajax miał problemy, co widzę z Joomla kodu php, za każdym razem, gdy wniosek, że joomla URL zawsze możesz liczyć a response header status code as 200, więc Twój javascript zawsze wyląduje na bloku kodu ajax, powracając z wiadomością opartą na jsonie, kiedy sprawdziłem kod joomla acymaling (wersja 5.8.1 dla joomli 3.8.3) dla tego kontrolera, widziałem na line number 74 sprawdzasz, czy żądanie jest wykonane przy użyciu ajax, ale brakuje Access-Control-Allow-Origin w nagłówku php, który ograniczy twoje połączenie zewnętrzne, dzięki czemu możesz zastąpić ten warunek if z:

if($ajax){ 
    @ob_end_clean(); 
    header("Content-type:text/html; charset=utf-8"); 
} 

do

if($ajax){ 
    @ob_end_clean(); 
    header("Content-type:text/html; charset=utf-8"); 
    header("Access-Control-Allow-Origin: *"); 
} 

tak aby umożliwić połączenia z innej domeny, a także, ale pamiętam, może to również spowodować luki do Ciebie kod Joomla. również trzeba zmienić formularza HTML, a także dodać jeszcze jedno ukryte pole w HTML:

<input type="hidden" name="ajax" value="1" /> 

tak aby umożliwić ajax wniosek pliku sterownika Joomla.

teraz w bloku sukcesu AJAX można dokonać wyboru coś takiego:

success:function(data, status, xhr){ 
    var json = $.parseJSON(data); 
    swal(json.message, json.type); 
} 

Mam nadzieję, że pomoże Ci w acomplishing co chcesz, Szczęśliwego kodowania.

Answer 2

Mam także do czynienia z tego typu problem. Dla rozwiązania tego typu problemu i Umieść zmienną w sukcesie jako argument html.

e.g. success(html) 

i

console.log(html)

ten pokazuje wszystkie błędy w tym zawiadomień i wszystko. włącz errore_reporting['E_ALL'];. i nie ustawiaj parametru dataType na 'json'.

Answer 3

ta prosta zmiana może zrobić dla Ciebie:

$(function() { 
    $('form').on('submit', function (e) { 
    e.preventDefault(); 
    $.ajax({ 
     type: 'post', 
     url: 'https://example.com/mailer/index.php?option=com_acymailing&ctrl=sub', 
     data: $('form').serialize() 
     } 
    }).done(function (data) { 
     swal('Great success!'); 
    }); 
    }); 
}); 

Ja osobiście lubię:

$.post("https://example.com...", { 
    data: $('form').serialize() 
}, function(data) { 
    swal('Great success!'); 
}); 

ponieważ Twój wynik jest w JSON, że powinno być więcej takich jak:

$.post("https://example.com...", { 
    data: $('form').serialize() 
}, function(data) { 
    console.log(data); // shows full return object in console 
    swal('Great success!'); 
}, "json"); 

Answer 4

Wypróbuj poniższe, wyjaśniłem zmiany w komentarzach:

$(function() { 
    $('form').on('submit', function (e) { 
     e.preventDefault(); 
     var formdata = $(this).serializeArray(); //i really prefer serializeArray better than serialize (up2u) 
     $.ajax({ 
      type: 'post', 
      dataType: 'json', //because your data is json 
      url: 'https://example.com/mailer/index.php?option=com_acymailing&ctrl=sub', 
      data: formdata, 
      success: function (d) {//d is the return/response of your url (your question answer) 
       swal(
        d.type+': '+d.code , 
        d.message, 
        d.type 
       ); 
      }, 
      error: function(d){ 
       swal(
        'Oops..' , 
        'Something went wrong!', //your json must be in trouble 
        'error' 
       ); 
       console.log(d); //delete this in production stage 
       console.log(d.responseText); //i add this so you will know what happenned exactly when you get this error. delete this too in production stage 
      } 
     }); 
    }); 
}); 

Answer 5

Proste rozwiązanie na Twoje pytanie brzmi:

success: function (data) { 
    $("#<id_of_tag>").html(data); 
} 

dane: odpowiedzi zwracane z serwera do wywołania AJAX

id_of_tag:, w którym chcesz wyświetlić zwrócony wynik.

To tylko przykład, możesz zdecydować, jakie dane chcesz zwrócić i co chcesz zrobić z odpowiedzią.

Aby odpowiedzieć na pytanie: W parametrze Sukces parametr będzie zawierał odpowiedź.

Podobnie jak w moim przypadku, zwracam inną stronę JSP, którą chcę wyświetlić w znaczniku div.

również sprawdzić pod adresem: Myślę, że to może pomóc

Best way to check if AJAX request was successful in jQuery

Answer 6

po prostu spojrzał na kodzie źródłowym i wygląda scenariusz został napisany przez kogoś, kto nie zna prawidłowej Content-Type dla JSON lub jak używać json_encode. Trzeba wprowadzić następujące zmiany do kodu AJAX:

$(function() { 
    $('form').on('submit', function(e) { 
    e.preventDefault(); 
    $.ajax({ 
     type: 'post', 
     url: 'https://example.com/mailer/index.php?option=com_acymailing&ctrl=sub', 
     data: $('form').serialize(), 
     success: function(jsonAsHtml) { 
     // the script sets Content-Type to text/html 
     // so jQuery's "intelligent guessing" fails 
     // you must call parseJSON on the content yourself 
     var data = $.parseJSON(jsonAsHtml); 
     swal('Great success! message=' + data.message + ', type=' + data.type + ', code=' + data.code); 
     } 
    }); 
    }); 
});