How to insert the error return into a specific part of html?

Asked

Viewed 36 times

1

JAVASCRIPT

$(document).ready(function(){
    $('#parcelas').on('change', function(){
        var parcela = this.value;
        var entrada = document.getElementsByName("entrada")[0].value;
        $("#bodyBoletos").html("");
        divida_id = {{$divida->id}};
        $.ajax({
        url:"/dashboard/admin/negociacao/parcelamento/"+divida_id+"/"+parcela+"/"+entrada,
        type: 'get',
        dataType: 'json',
        success: function(response){


            var len = response.length;
            for(var i=0; i<len; i++){
                var numero = response[i].numero;
                var vencimento = response[i].vencimento;
                var valor = response[i].valor;


                var tr_str = "<tr>" +
                    "<td>" + numero + "</td>" +
                    "<td>" + vencimento + "</td>" +
                    "<td>R$ " +formatMoney(valor) + "</td>" +

                    "</tr>";

                $("#boletos tbody").append(tr_str);
            }

        },error: function (data) {

                    var html = '';
                    if(data.errors)
                    {
                    html = '<div class="alert alert-danger">';
                    for(var count = 0; count < data.errors.length; count++)
                    {
                    html += '<p>' + data.errors[count] + '</p>';
                    }
                    html += '</div>';
                    $('#form_result').html(html);
                    }
                }

    });

HTML

  <span id="form_result"> ...erros aqui... </span>
  • 1

    Hello @André, I saw that you are trying to insert the errors in the html inside the callback error ajax (,error: function (data){), I think maybe that’s your problem, usually this callback is executed when something goes wrong with the request (Ex.: Not Found, Internal Server Error, blocked by CORS, no internet, parsererror, ...), if you are returning a json with errors it should be coming to Success.

  • 1

    That’s right, I put together Success and adjusted the return in php and it worked.

1 answer

1


As I said in the question comment, was right the way you selected the element and added the HTML text $('#form_result').html(html);, the problem was in the fact that this code is being called inside the callback error:function( jqXHR jqXHR, String textStatus, String errorThrown ) of $.ajax, since normally this callback is called only when a request failure, as an example: Not Found, Internal Server Error, blocked by CORS, parsererror, on the internet Connection, etc....

And since your service was returning a JSON with errors, it would be arriving at callback success:function( Anything data, String textStatus, jqXHR jqXHR )

jQuery.ajax( [settings ] )

error:

Type: Function( jqXHR jqXHR, String textStatus, String errorThrown )
A Function to be called if the request fails.
The Function receives three Arguments:

  1. The jqXHR (in jQuery 1.4.x, Xmlhttprequest) Object
  2. A string describing the type of error that occurred and an optional Exception Object, if one occurred.
    Possible values for the Second argument (Besides null) are "timeout", "error", "abort", and "parsererror".
  3. When an HTTP error occurs, errorThrown receives the textual Portion of the HTTP status, such as "Not Found" or "Internal Server Error."

Browser other questions tagged

You are not signed in. Login or sign up in order to post.