Laravel 5.2 Ajax hinzufügen

-1

Ich habe den folgenden Laravel-Code, der Get und Post-Anfragen verwendet, die funktioniert. Ich versuche, eine Ajax hinzuzufügen, aber ich kämpfe. Wie würde ich Ajax hinzufügen?Laravel 5.2 Ajax hinzufügen

Hier ist der Code in der Ansicht. Hier

<form action="goal" method="post"> 
<input name="usersID" type="form"> usersID </input> <br> 
<input name="goalValue" type="form"> goal </input> <br> 
<input name="goalpoints" type="form"> goalpoints </input> <br> 
<input name="points" type="form"> points </input> <br> 
<input name="activitiesID" type="form"> activitiesID </input> <br> 
<button type="submit"> Submit </button> 
</form>

ist der Code in der Route

Route::get("goal", "[email protected]"); 
Route:: post("goal", 
["as" => "goal", 
"uses" => "[email protected]"]);

Hier ist der Code in den Controllern
// Controller 1

public function getGoal() 
{ 
return view("pages.goal"); 
}

// Controller 2

public function getGoal() 
{ 
$usersID = $_POST["usersID"]; 
$goal = $_POST["goalValue"]; 
$goalpoints = $_POST["goalpoints"]; 
$points = $_POST["points"]; 
$activitiesID = $_POST["activitiesID"]; 

DB :: table("goals") -> insert 
(
array("usersID" => $usersID, "goal" => $goal, "goalpoints" => $goalpoints, "points" => $points, 
"activitiesID" => $activitiesID) 
); 
return view("pages.goal"); 
}

Quelle

2016-04-28 ray

Es gibt ein paar Optionen - eine Option ist das Importieren von jQuery und die Verwendung der eingebauten [$ .get] (https://api.jquery.com/jquery.get/) und [$ .post] (https: // api.jquery.com/jquery.post /) Methoden – Crwydryn

Ich habe versucht, es in beiden Richtungen zu tun, aber eine jQuery Antwort wäre schön, wie es mit verschiedenen Browsern – ray

Die bereitgestellte Antwort von @Crwydryn arbeiten würde, ist gut. Nur als Nebenbemerkung würde ich versuchen, die Methoden in Ihrem Controller ein wenig anders zu benennen. Zum Beispiel sollte "getGoal" in Controller 2 (von dem ich annehme, dass es der 'tableController' ist) wahrscheinlich umbenannt werden, da es das Ziel (vielleicht etwas wie' setGoal() ') _setts__. Dies kann helfen, Verwirrung zu vermeiden, wenn die Controller komplexer werden. Nur ein Gedanke. – camelCase

Unter der Annahme, dass Sie Ihr Wissen über JQuery/Javascript begrenzt ist (verzeihen Sie mir, wenn nicht) Ich als die in etwas mehr Detail gehen bestehende Antwort.

Ich würde beginnen, indem Sie eine ID zu Ihrem Formular hinzufügen.

<form action="goal" method="post" id="goalForm">

nächstes würde ich in CSRF documentation on Laravel aussehen sonst können Sie Fehler „Token Konflikt“ im Zusammenhang zu bekommen. Kurz gesagt müssen Sie 1 von zwei Dinge tun:

hinzufügen <input type="hidden" name="_token" value="<?php echo csrf_token(); ?>"> auch alle Formulare.
Fügen Sie <meta name="csrf-token" content="<?= csrf_token() ?>"> in Ihrem <head> Abschnitt hinzu.

Wenn Option 2 Sie werden auch dieses Javascript an der Unterseite der Vorlage hinzufügen müssen:

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

Dies wird Ihr Token auf alle Ihre AJAX-Anforderungen hinzufügen.

Verwenden Sie als Nächstes JQuery, um die Formularübermittlung zu verarbeiten.

$('#goalForm').submit(function(e){ 

    // I have passed in the event 'e' and preventing default browser functionality. 
    e.preventDefault(); 

    var formData = $(this).serialize(); //Get the form data and put in a structure i can send 

    $.post('goal', formData).done(function(response){ 
     // after the ajax is done, do something with the response 
     alert(response); 
    }); 
});

Ihre Controller-Methode müssen etwas zurück (unter der Annahme Controller 2):

public function getGoal() 
{ 
    $usersID = $_POST["usersID"]; 
    $goal = $_POST["goalValue"]; 
    $goalpoints = $_POST["goalpoints"]; 
    $points = $_POST["points"]; 
    $activitiesID = $_POST["activitiesID"]; 

    try{ 
     DB::table("goals")->insert(
      array("usersID" => $usersID, "goal" => $goal, "goalpoints" => $goalpoints, "points" => $points, "activitiesID" => $activitiesID) 
     ); 
    } catch (\Exception $e) { 
     echo "something went wrong"; 
    } 
    echo "Awesome it worked"; 
}

Ich habe einen try/catch einhüllen Ihre DB hinzugefügt Insert schlägt fehl. Sie können das Echo auch nur zu Testzwecken reproduzieren.

Quelle

2016-04-28 15:29:26 DavidT

keine Sorgen mein Wissen über beides ist begrenzt. Ich habe Ihre Anweisungen befolgt, aber ich erhalte keine Benachrichtigungen. – ray

Das könnte daran liegen, dass Ihre Controller-Methode nichts zurückgibt. Ich werde mit einigen weiteren Details aktualisieren – DavidT

Danke. Wenn ich das Formular absende, soll der Controller, der Anfragen bearbeitet, die Ansicht "pages.goal" zurückgeben. Ich bin mir ziemlich sicher, dass dieser Teil funktioniert. – ray

Im Anschluss an meinen Kommentar können Sie jQuery dazu verwenden (es gibt andere Optionen, bei denen Sie jQuery nicht herunterladen müssen) über die Methoden $.get und $.post von jQuery.

Hier ist ein Beispiel dafür, wie man eine bekommen mit jQuery tun würde:

$.get("goal", function(data) { 
    //this is called when a successful get request is made. The server response is in the data object 
});

Quelle

2016-04-28 14:47:54 Crwydryn

Also versuche ich dies in der View-Datei zu tun, und ich brauche nichts in den Routen, und die Warnung sollte auf eine Get-Anfrage ausgelöst werden? – ray

Nun ich persönlich würde das Skript in einer eigenen Datei gesetzt - Trennung von Bedenken und das alles - Sie müssen das jQuery Framework in Ihrer Ansicht referenzieren (und die Skriptdatei, wenn Sie es heraus zu trennen) - Nutzen Sie die Google CDN oder ähnlich für jQuery, oder ziehen Sie die Datei in Ihr Projekt und referenzieren Sie es lokal – Crwydryn

Laravel 5.2 Ajax hinzufügen

Antwort

Verwandte Themen