AngularJS POST to Server

Mam formę kątową JS, która wysyła dane do serwletu Java, ale nie widzę, aby żądanie zostało wykonane; servlet "create" nie został wywołany.AngularJS POST to Server

Oto mój kod:

test.html

<body> 
    <form ng-controller="UserController"> 

     <legend>Create User</legend> 
     <label>Name</label> 
     <input type="text" id="name" name="name" ng-model="name" placeholder="User Name"> 

     <label>Email</label> 
     <input type="text" id="email" name="email" ng-model="email" placeholder="ur email here"> 

     <label>Password</label> 
     <input type="text" id="pwd" name="pwd" ng-model="pwd" placeholder="ur own pwd here"> 

     <button ng-submit="createUser()" class="btn btn-primary">Register</button> 

    </form> 
</body>

script.js

function UserController($scope, $http) { 
    $scope.user = {}; 
    $scope.createUser = function() { 
     $http({ 
      method : 'POST', 
      url : '/create', 
      data : 'name=' + $scope.user.name + '&email=' + $scope.user.email, 
      headers : { 
       'Content-Type' : 'application/x-www-form-urlencoded' 
      } 
     }) 
    }

mój serwlet jest jak poniżej, ale nie drukuje "Opublikuj" a wszystko.

public class FirstServlet extends HttpServlet 
{ 

    /** 
    * 
    */ 
    private static final long serialVersionUID = 1L; 

    @Override 
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) 
      throws ServletException, IOException 
    { 
     System.out.println("Get"); 
    } 

    @Override 
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) 
      throws ServletException, IOException 
    { 
     System.out.println("Post"); 
    } 
}

Serwer WWW jest pomost, a web.xml jak poniżej:

<?xml version="1.0" encoding="UTF-8"?> 
<web-app xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
    version="2.4" 
    xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"> 
    <servlet> 
     <servlet-name>createUser</servlet-name> 
     <servlet-class>servlet.FirstServlet</servlet-class> 
     <load-on-startup>0</load-on-startup> 
    </servlet> 
    <servlet-mapping> 
     <servlet-name>createUser</servlet-name> 
     <url-pattern>/create</url-pattern> 
    </servlet-mapping> 
</web-app>

Źródło

2013-02-24 yxdming

Mam edytowane moją odpowiedź na to kod serwletu. Jest to prawdopodobnie najbardziej obszerna odpowiedź, jaką napisałem, haha –

Wierzę, że jego problemem było to, że ng-submit nie znajdował się na znacznikach formularza, jak odpowiedziałem poniżej. –

Wstawiłbym console.log do funkcji createUser js. Ponadto, czy jesteś pewien, że twoje połączenie http może rozwiązać właściwy adres URL serwera? Możesz to sprawdzić w swojej karcie sieci narzędzi narzędziowych Chrome Chrome? Na koniec, w swoim poście http, używasz łańcucha zapytania, nie musisz tego robić, po prostu spróbuj tego, co @ ChristianStewart zasugerował dla parametrów danych. – mentat

Aby wysyłać dane do serwera WWW, będziemy chcieli, aby powiązać wartości formularza do obiektu w $ zakres, a następnie przesłać ten obiekt do skryptu.

Sztuką jest przesłanie całego obiektu "user" na serwer, a Angular automatycznie sformatuje go w JSON. Ponadto znaczniki ng-model nie używały "użytkownika".

Inną rzeczą, na którą należy zwrócić uwagę, jest to, że najprawdopodobniej zechcesz załączyć coś, co ma zrobić aplikacja po zakończeniu żądania. Możesz użyć metod ".success (function (data) {})" i ".error (...)" aby to zrobić (są to metody na obiecanych zwrotach $ http).

Zawarłem kod PHP i Servlet; to samo dotyczy wszystkich skryptów serwera (dane JSON z Angular).

HTML

<body> 
<form ng-controller="UserController" ng-submit="createUser()"> 

    <legend>Create User</legend> 

    <label>Name</label> 
    <input type="text" id="name" name="name" ng-model="user.name" placeholder="User Name"> 

    <label>Email</label> 
    <input type="text" id="email" name="email" ng-model="user.email" placeholder="ur email here"> 

    <label>Password</label> 
    <input type="text" id="pwd" name="pwd" ng-model="user.pwd" placeholder="ur own pwd here"> 

    <button class="btn btn-primary">Register</button> 

</form> 
</body> 

</html>

Controller

function UserController($scope, $http) { 
    $scope.user = {}; 
    $scope.createUser = function() { 
     $http({ 
      method : 'POST', 
      url : '/create', 
      data : $scope.user 
     }) 
    }

Przykład Kod serwera: PHP

$data = file_get_contents("php://input"); 
$objData = json_decode($data); 

$pwd = $objData -> pwd; 
$user = $objData -> name; //etc

Przykład Kod serwera: Java Servlet

JSONObject jObj = new JSONObject(request.getParameter("mydata")); // this parses the json 
Iterator it = jObj.keys(); //gets all the keys 

while(it.hasNext()) 
{ 
    String key = it.next(); // get key 
    Object o = jObj.get(key); // get value 
    //do something with it here 
    //you can also do: 
    String user = jObj.get("user"); 
}

Źródło

2013-02-24 01:03:20

Nie używam php. Napisałem prosty serwlet przez java. Wygląda jednak na to, że js nie opublikował poprawnego kodu. – yxdming

Mam teraz demo JAVA Servlet. –

Problem polega na tym, że serwlet nie może uzyskać poprawnych danych. Kluczowym problemem jest to, że kątowe js nie mogą działać poprawnie. Kiedy ja i do linii w js, linie te nie mogą zostać wywołane. – yxdming

zmiana ng-submit="" do ng-cick=""

Źródło

2015-10-30 04:57:09

to zostało przegłosowane -1, ale faktycznie rozwiązało problem, który miałem .. ng-submit nie pozwoliłby mi zrobić ajax calll kalendarza na tę samą stronę, ale zmieniając na type = button verse type = submit i using ng-click works –

Czy chodziło Ci o 'ng-click'? – rinogo

AngularJS POST to Server

Odpowiedz

Powiązane problemy