database - AngularJs doens't communicate with Servlet -
i'm writing vary simple web page should take 2 input , insert database i'm trying use angularjs. if don't use angular, can communicate servlet , works perfectly, can't angular. give here details of project. project name: angulardb
index.html
<body data-ng-app="noteapp"> <div> <form data-ng-control="notectrl" ng-submit="addnote()"> <div class="namecontainer"> inserisci il nome: <input type="text" name="nome" data-ng-model="nome"><br> </div> <div class="notecontainer"> inserisci qui una nota: <textarea rows="5" cols="50" name="note" data-ng-model="note"></textarea> <br> <button>invia dati</button> </div> </form> </div> controller.js
var app=angular.module('noteapp', []) app.controller('notectrl', function ($scope, $http){ $scope.mynote = function() {} $scope.addnote = function () { $http({ method: 'post', url: 'http://localhost:8080/angulardb/webappdbservlet', data: {"nome":$scope.nome, "note":$scope.note} }) } }) servlet inside (default package) registerservlet.java
import java.io.ioexception; import java.sql.connection; import java.sql.drivermanager; import java.sql.preparedstatement; import java.sql.sqlexception; import javax.servlet.servletexception; import javax.servlet.annotation.webservlet; import javax.servlet.http.httpservlet; import javax.servlet.http.httpservletrequest; import javax.servlet.http.httpservletresponse; @webservlet("/webappdbservlet") public class registerservlet extends httpservlet { private static final long serialversionuid = 1l; // jdbc driver name , database url static final string jdbc_driver = "org.gjt.mm.mysql.driver"; static final string db_url = "jdbc:mysql://localhost:3306/fabio"; // database credentials static final string user = "root"; static final string pass = "*******"; public registerservlet() { super(); } protected void doget(httpservletrequest request, httpservletresponse response) throws servletexception, ioexception { response.getwriter().append("served at: ").append(request.getcontextpath()); } protected void dopost(httpservletrequest request, httpservletresponse response) throws servletexception, ioexception { doget(request, response); connection conn=null; try{ string name = request.getparameter("nome"); string note = request.getparameter("note"); class.forname("org.gjt.mm.mysql.driver"); conn = drivermanager.getconnection(db_url, user, pass); string sql = "insert fabio.appunti (nome, note) values ('"+name+"', '"+note+"');"; preparedstatement pssql = conn.preparestatement(sql); pssql.executeupdate(); }catch(exception e){ e.printstacktrace(); }finally{ try{ if(conn!=null) conn.close(); }catch(sqlexception se){ se.printstacktrace(); } } } } web.xml
<?xml version="1.0" encoding="utf-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/xmlschema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemalocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="webapp_id" version="3.0"> <display-name>angulardb</display-name> <welcome-file-list> <welcome-file>index.html</welcome-file> <welcome-file>index.htm</welcome-file> <welcome-file>index.jsp</welcome-file> <welcome-file>default.html</welcome-file> <welcome-file>default.htm</welcome-file> <welcome-file>default.jsp</welcome-file> </welcome-file-list> <servlet> <servlet-name>registerservlet</servlet-name> <servlet-class>registerservlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>registerservlet</servlet-name> <url-pattern>/webappdbservlet</url-pattern> </servlet-mapping> </web-app> if, instead of
<form data-ng-control="notectrl" ng-submit="addnote()"> i write this
<form action="webappdbservlet" method="post" data-ng-control="notectrl"> i know works know problem angularjs.
try this
<form data-ng-control="notectrl"> <div class="namecontainer"> inserisci il nome: <input type="text" name="nome" data-ng-model="data.nome"><br> </div> <div class="notecontainer"> inserisci qui una nota: <textarea rows="5" cols="50" name="note" data-ng-model="data.note"></textarea> <br> </div> <button ng-click="addnote(data)>invia dati</button> </form> then in controller
$scope.addnote = function (data) { //data should return object of $cope.nome , $scope.note in 1 object $http.post('/angulardb/webappdbservlet', data, headers: {'content-type': 'application/json'}) .then( function(response) { console.log('success if post worked', response) }, function(error) { console.error('error if error processing post', error); }); }
Comments
Post a Comment