Validierungsfehler im AJAX-Modus

Lesezeit: 5 Minuten

Benutzer-Avatar
Benutzer2094178

Derzeit verwende ich dies, um Validierungsfehler über Ajax anzuzeigen:

            if (data.validation_failed == 1)
            {
                var arr = data.errors;
                $.each(arr, function(index, value)
                {
                    if (value.length != 0)
                    {
                        $("#validation-errors").append('<div class="alert alert-error"><strong>'+ value +'</strong><div>');
                    }
                });
                $('#ajax-loading').hide();
                $("#validation-errors").show();
            }

Funktioniert einwandfrei, macht genau das was ich brauche.

Das Problem ist, was ich tun muss, um die Fehler von Laravel nach Ajax zu transportieren:

    $rules = array( 
        'name'  => 'required',
        'password' => 'required'
    );

    $v = Validator::make(Input::all(), $rules);

    if ( ! $v->passes())
    {

    $messages = $v->messages();

    foreach ($rules as $key => $value)
    {
        $verrors[$key] = $messages->first($key);
    }

        if(Request::ajax())
        {                    
            $response_values = array(
                'validation_failed' => 1,
                'errors' => $verrors);              
        return Response::json($response_values);
        }
        else
        {
        return Redirect::to('login')
            ->with('validation_failed', 1)
            ->withErrors($v);
        }       

    }

Wenn ich die Feldnamen als Schlüssel haben möchte, muss ich $rules iterieren, aber selbst wenn ich keine Feldnamen als Schlüssel verwende, muss ich Fehlermeldungen iterieren, um $verrors zu konstruieren.

Wie könnte ich konvertieren $v->messages() zum Äquivalent von $verrors ohne iterieren zu müssen? Seit Response::json() erwartet ein Array anstelle eines Objekts.

Benutzer-Avatar
DerLola

Der einfachste Weg ist die Nutzung der MessageBag Objekt des Validators. Dies kann folgendermaßen erfolgen:

// Setup the validator
$rules = array('username' => 'required|email', 'password' => 'required');
$validator = Validator::make(Input::all(), $rules);

// Validate the input and return correct response
if ($validator->fails())
{
    return Response::json(array(
        'success' => false,
        'errors' => $validator->getMessageBag()->toArray()

    ), 400); // 400 being the HTTP code for an invalid request.
}
return Response::json(array('success' => true), 200);

Dies würde Ihnen eine JSON-Antwort wie diese geben:

{
    "success": false,
    "errors": {
        "username": [
            "The username field is required."
        ],
        "password": [
            "The password field is required."
        ]
    }
}

  • Dies mag ein dummer Kommentar sein – aber bedeutet das Setzen des http-Codes auf 400 nicht, dass die JSON-Antwort vollständig ignoriert wird?

    – Bohnen

    7. November 2013 um 21:03 Uhr

  • Hängt vom „Client“ ab, der den JSON liest. jQuery zum Beispiel handhabt dies perfekt. Es löst nicht den Erfolg aus, sondern den Fehler-Callback, was Sie wollen.

    – DerLola

    8. November 2013 um 12:29 Uhr

  • Wenn Sie jQuery verwenden, können Sie mit diesem Code in der Ajax-Anforderung Fehler erhalten: error: function(xhr, status, data){ console.log(xhr.responseJSON.errors); }

    – Jako

    10. Februar 2015 um 9:24 Uhr


  • Vielen Dank. Wissen Sie, wie Sie die Antwort ändern können, um anstelle eines Arrays eine Zeichenfolge pro Feld zurückzugeben? Ich habe versucht, mehrere Fehlerzeichenfolgen in einem Feld zu erhalten, aber es scheint nicht möglich zu sein.

    – JCarlosR

    17. August 2016 um 18:37 Uhr

  • @JCarlos Der Nachrichtenbeutel gruppiert sie in einem Array. Sie könnten die Elemente wie folgt zuordnen: 'errors' => array_map(function($fieldErrors) { return $fieldErrors[0]; }, $validator->getMessageBag()->toArray())

    – DerLola

    18. August 2016 um 8:41 Uhr

Versuchen Sie in der Ajax-Antwort so etwas wie

    .fail(function( data ) {
        var response = JSON.parse(data.responseText);
        var errorString = '<ul>';
        $.each( response.errors, function( key, value) {
            errorString += '<li>' + value + '</li>';
        });
        errorString += '</ul>';

Laravel 5 gibt automatisch einen Validierungsfehler zurück

Dafür müssen Sie nur Folgendes tun,

Regler:

public function methodName(Request $request)
{
    $this->validate($request,[
        'field-to-validate' => 'required'
    ]);

    // if it's correctly validated then do the stuff here

    return new JsonResponse(['data'=>$youCanPassAnything],200);
}

Aussicht:

         $.ajax({
            type: 'POST',
            url: 'url-to-call',
            data: {
                "_token": "{{ csrf_token() }}",
                "field": $('#field').cal()
            },
            success: function (data) {
                console.log(data);
            },
            error: function (reject) {
                if( reject.status === 422 ) {
                    var errors = $.parseJSON(reject.responseText);
                    $.each(errors, function (key, val) {
                        $("#" + key + "_error").text(val[0]);
                    });
                }
            }
        });

Sie können für jeden bauen validation Feld eins <span> Tag mit id als Feldname und Suffix _error Daher wird ein Validierungsfehler mit der obigen Logik wie folgt angezeigt:

<span id="field_error"></span>

Ich hoffe es hilft 🙂

  • aber wenn ich zum Beispiel einen Fehler korrigiere und erneut klicke, wie kann ich dann diese spezifische Meldung entfernen, die ein Fehler war und jetzt korrigiert wird?

    – Marco Bozzola

    17. Juli 2020 um 13:02 Uhr


  • @MarcoBozzola Sie müssen alle Nachrichten entfernen und Nachrichten erneut aus der Antwort setzen, wenn dies fehlschlägt, ansonsten alles gut.

    – Sagar Naliyapara

    23. Juli 2020 um 13:29 Uhr

  • gutes beispiel bruder

    – fahdshaykh

    11. Mai um 10:49 Uhr

Benutzer-Avatar
SEO-Ära

Versuchen Sie diesen Code. Es funktioniert gut:

$.ajaxSetup({
    headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')}
});



$("#sendData").submit(function(e) 
{
    e.preventDefault();
    var formData  = new FormData(jQuery('#sendData')[0]);
    $.ajax({

       type:'POST',
       url:"/your(URL)",
       data:formData,
        contentType: false,
        processData: false,
       success:function(data)
       {
          alert(data);
       },
        error: function(xhr, status, error) 
        {

          $.each(xhr.responseJSON.errors, function (key, item) 
          {
            $("#errors").append("<li class="alert alert-danger">"+item+"</li>")
          });

        }

    });

});

Ich habe es auf diese Weise für Laravel 5.5 gehandhabt

HTML Quelltext

<div class="form-group  padding">
  <label for="">Kalyan Mandap Name <span class="text-danger">*</span></label>
  <input type="text" class="form-control" placeholder="Enter Kalyan Mandap Name" id="mandapName" name="mandapName" value = "<?php echo (isset($mandapDetails['vchKalyanMandapName'])) ? $mandapDetails['vchKalyanMandapName'] : ""; ?>" required="required">
  <span class="text-danger">{!! $errors->first('mandapName', ':message') !!} </span>
</div>

Controller-Validierungscode

 // Validate form data
    $validatedData = request()->validate([
      'mandapName' => 'required',
      'location' => 'required',
      'landmark' => 'required',
      'description' => 'required',
      'contactNo' => 'required',
      'slug' => 'required',
      'functional' => 'required'
    ]);

Und in Javascript

     $.ajax({
        //.....Your ajax configuration
        success: function (data) {
            // Success code

        },
        error: function (request, status, error) {
            $('[name="mandapName"]').next('span').html(request.responseJSON.errors.mandapName);
            //.......
        }
    });

Benutzer-Avatar
Alexey Mezenin

Es gibt eine bessere Möglichkeit, Validierungsfehler bei der Verwendung von Ajax-Anforderungen zu behandeln.

Erstellen Sie beispielsweise wie gewohnt eine Request-Klasse UploadFileAjaxRequest:

public function rules()
{
    return [
        'file' => 'required'
    ];
}

Verwenden Sie es in einer Controller-Methode:

public function uploadFileAjax(UploadFileAjaxRequest $request)

Wenn ein Fehler auftritt, wird ein Array von Fehlern zurückgegeben, die Sie in JS verwenden können:

$.ajax({
    ....
    error: function(data) {
        var errors = data.responseJSON; // An array with all errors.
    }
});

Ich habe es geschafft, versuchen Sie es, ich hoffe, es hilft Ihnen bei Renderfehlern nach den relevanten Feldern.

$("#booking_form").submit(function(e){
                e.preventDefault();
                let form_data = $("#booking_form").serialize()
                $(document).find("span.text-danger").remove();
                $.ajax({
                    url : "your-url",
                    type : "POST",
                    data : form_data,
                    success : function(response){

                    },
                    error:function (response){
                        $.each(response.responseJSON.errors,function(field_name,error){
                            $(document).find('[name="+field_name+"]').after('<span class="text-strong textdanger">' +error+ '</span>')
                        })
                    }
                })
            })

1216150cookie-checkValidierungsfehler im AJAX-Modus

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy