Ajax/jQuery mit Mongodb

Ich bin ziemlich neu bei Ajax/jQuery. Ich versuche, eine Beispiel-HTML-Seite basierend auf Ajax/jQuery zu erstellen, um alle Kunden zu erhalten und einen Kunden nach ID zu suchen. Jeder Kunde hat drei Variablen: ID, firstName und lastName.Ajax/jQuery mit Mongodb

Ich möchte einen Kunden erstellen, löschen und aktualisieren. Wie kann dies umgesetzt werden?

Aktuelle HTML mit Javascript:

<html> 
<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
</head> 
<body> 
    <input name="search" type="text" maxlength="100" id="search"/> 
    <button onclick="searchID()"> Search ID </button> 
    <button onclick="showAll()"> Show All </button> 
     <button onclick="createCustomer"> CreateCustomer </button> 
     <button onclick="updateCustomer"> UpdateCustomer </button> 
     <button onclick="deleteCustomer"> DeleteCustomer </button> 


    <div id="persons"></div> 

    <script> 
     function searchID() 
     { 
      var id = document.getElementById("search").value; 
      $("#persons").html(""); 


      $.getJSON("http://192.168.17.128:8080/customers/" + id, function(data) 
      { 
       for (var i in data) { 
        $('#persons').append("<p>ID: " + data[i].id + "</p>") 
        $('#persons').append("<p>First name: " + data[i].firstName + "</p>") 
        $('#persons').append("<p>Last name: " + data[i].lastName + "</p><br>") 
       } 
      }); 


     } 

     function showAll() 
     { 
      $("#persons").html(""); 

      $.getJSON("http://192.168.17.128:8080/customers/", function(data) 
      { 
       for (var i in data) { 
        $('#persons').append("<p>ID: " + data[i].id + "</p>") 
        $('#persons').append("<p>First name: " + data[i].firstName + "</p>") 
        $('#persons').append("<p>Last name: " + data[i].lastName + "</p><br>") 
       } 
      }); 
     } 
    </script> 
</body> 
</html>

Quelle

2017-02-22 Anonymous

Der oben angezeigte Code dient zum Anzeigen der Serverantworten. Funktioniert dieser Code derzeit so, wie Sie es möchten? –

Ja, es funktioniert sehr gut :) –

Sie den Anzeigeteil in Angriff genommen haben. Das ist gut. Was das Hinzufügen/Aktualisieren/Löschen betrifft, gibt es viele verschiedene Methoden und Formate, die Sie verwenden können.

Wenn Sie eine Suche im Internet durchführen, finden Sie Wörter wie REST, SOAP und mehr. Jede dieser Methoden ist eine Methode der Kommunikation mit einem Server, die definiert, wie der Server Anfragen empfängt. Welche Methode Sie wählen, ist nicht wichtig. Und Sie können sogar keine Methode verwenden, wenn Sie möchten, und etwas ganz Eigenes machen.

Hier ist, was wichtig ist:

Entscheiden Sie, welches Signal Sie an den Server senden.

Für eine Aktualisierungsanforderung möchten Sie alle Personendaten und die Datensatz-ID für die Person, die aktualisiert wird, einschließen.

Für eine Erstellungsanfrage sollten Sie nichts senden, aber Sie sollten die ID einer neu erstellten Person erhalten. ODER, Sie könnten eine komplette Person ohne ID senden und den Server mit der zugewiesenen ID antworten lassen ... Ihre Wahl !!!

Beginnen Sie für eine Löschanforderung mit einem einfachen System und senden Sie nur die ID der Person, die entfernt wird. Später können Sie weitere Parameter hinzufügen, um zu überprüfen, ob der Benutzer über die Löschanforderung sicher ist. Beginne einfach und baue von dort aus.
Entscheiden Sie, welches Signal empfangen werden, nachdem die Anforderung gesendet wird

Einen Teil davon wir über einen in Schritt gesprochen. Wenn wir beispielsweise eine neue Person erstellen, möchten wir die neue ID für diese Person in der Antwort vom Server sehen. Wenn wir die neue Personen-ID nicht senden, möchten wir zumindest einen Bestätigungscode, der angibt, dass die Person erstellt wurde.

Denken Sie darüber nach, was Sie von der Browser-Seite sehen möchten, um ein erfolgreiches Update zu bestätigen und zu löschen. Wie sollen Fehler von der Browser-Seite aussehen?

Sobald Sie all dies haben, können Sie beginnen, den Code zu erstellen.
Erstellen Sie die Server

Sobald Sie sich auf ein Verfahren entscheiden, können Sie einen Server erstellen kann beginnen. Zum Zweck der Diskussion verwenden wir Folgendes. Wir senden Update-Anfragen an mysite.com/person/update.php. Wir werden Löschanforderungen an mysite.com/person/delete.php senden und Anforderungen an mysite.com/person/create.php erstellen. Sie werden feststellen, dass ich in diesem Beispiel PHP als serverseitige Sprache gewählt habe.

Wir werden POST verwenden, um alle Daten, die wir senden, zu tragen, und wir werden Daten im Browser im JSON-Format erhalten.

Sobald wir diesen Plan haben, können wir drei PHP-Skripte erstellen, um die Arbeit zu erledigen, die wir brauchen. Die Update-Skript könnte wie folgt aussehen:

Person/update.php:

$id = $_POST['id']; 
$fname = $_POST['first_name']; 
$lname = $_POST['last_name']; 

/* perform some checking for SQL injection attacks */ 

/* use the ID to update the database */ 

/* prepare a response to the web browser */ 
$response = new StdClass(); 
$response->type = "update"; 
$response->id = $id; 
$response->status = "SUCCESS"; 
echo(json_encode($response)); 
/* end file after outputting JSON response */

hinzufügen AJAX-Aufrufe an Ihren Kunden (die Website)

Im obigen Beispiel definieren wir einige wichtige Dinge. Wir suchen nach Werten in den Postfeldern mit den Namen "id", "first_name" und "last_name", sodass unser Webclient die Formulardaten in diesen drei Feldern senden muss.

Auch im obigen Beispiel haben wir drei Werte in der Antwort festgelegt: 'type', 'id', 'status'. Unser AJAX-Code sollte wissen, wie man diese Werte betrachtet und entscheidet, ob weitere Aktionen erforderlich sind, oder dem Benutzer der Site ein Erfolgsergebnis anzeigen, da wir alle eine Bestätigung wünschen, dass das, was wir tun, tatsächlich funktioniert.

Denken Sie daran, dass diese Werte Werte sind, die ich vor Ort ausgewählt habe, was bedeutet, dass der Entwickler (That's you) die volle Kontrolle hat.

Entwerfen Sie Ihren AJAX zum Senden und Empfangen basierend auf den Entscheidungen, die Sie in den Schritten 1, 2 und 3 getroffen haben. Wenn Sie Probleme haben, kommen Sie zurück zu Stack Overflow. Erzähl uns von deiner Idee und was du versuchst zu tun und welche Arbeit du getan hast. Teilen Sie uns Ihren Code mit und bitten Sie um weitere Ratschläge.

Wie es aussieht, ist Ihre Frage viel zu breit für uns in der Lage sein, das Sie mit spezifischere Beispiele zu beantworten, weil alle Entscheidungen in den Händen sind. Ich hoffe, dass meine Antwort Ihnen einige Dinge zum Nachdenken gegeben hat und Ihnen helfen wird, sich auf den nächsten Schritt zu bewegen.

Happy Coding!

P.S. Es ist möglich, Abfragen direkt an einen Datenbankserver zu senden. Ich empfehle das Gegenteil. Halten Sie Ihre Webanwendungen leicht (klein) und lassen Sie Serveranwendungen die schwere Arbeit wie die Datenbankkommunikation bewältigen.

Quelle

2017-02-22 03:23:42

Ajax/jQuery mit Mongodb

Antwort

Verwandte Themen