DEV Community

thenewave
thenewave

Posted on

 

How can I send a variable from AngularJS to Java?

Hi everyone. Im using the angular tag since its the only one, I dont know if it includes AngularJS as well... I've been trying to send a variable inside of a JS Controller to my Java server using $http, but I cant get it to work: once I try it out, I cant enter the HTML view in which this JS code is used, so the problem is coming from the JS controller. Here's what I am doing and the code, based on trying to adapt these two resources:

https://docs.angularjs.org/api/ng/service/$http
http://hello-angularjs.appspot.com/angularjs-http-service-ajax-post-code-example


javascript
angular
.module('myApp')
.controller('MessageController', MessageController);

MessageController.$inject = ['$scope', '$stateParams', '$uibModalInstance', 'MessageTemplate', 'JhiLanguageService'];

onFormatChange.$inject = ['$resource', '$http', 'ServerURL']; // should it be vm.onFormatChange.$inject instead? 

function MessageController ($scope, $stateParams, $uibModalInstance, MessageTemplate, JhiLanguageService) {
    var vm = this;
    vm.isSaving = false;

    vm.text = 'Activated'; // this is the only variable
                           // im trying to send to Java

    function onSaveSuccess (result) {
        // a console.log
    }

    function onSaveError (error) {
        // a console.log
    }

    // this function gets called from the HTML via ng-change
    vm.onFormatChange = function () {
        vm.text = vm.status ? 'Deactivated' : 'Activated';

        // Sending vm.text (as "format") to the server 
        $http.post(ServerURL + 'api/format/', {
            format: vm.text // should it be format = vm.text?
            }. {withCredentials: true,
                headers: {
                    'Content-Type': 'application/json; charset=utf-8',
                    'Access-Control-Allow-Origin': true,
                    'X-Requested-With': 'XMLHttpRequest'
                }
        }).then(onSaveSuccess, onSaveError);
    }
}

Top comments (5)

Collapse
 
michaeljota profile image
Michael De Abreu

Just to give you proper context about searching a solution for this, it doesn't make any difference the language of the server. For AngularJS point of view, it will be only an API Restful.

headers in this case is not necessary.

You are "injecting" into onFormatChange, but that's a variable you are not declaring. Also, you can not inject in any variable, just controllers, components, services, and other functions declared in the AngularJS module function.

I'm guessing you have errors on vm.onFormatChange. That's because you don't have a reference for $http.

I guess you are new in to web development, maybe you have a Java background and want to learn, or are being forced to learn AngularJS. If it is the first case, I would recommend learning Angular directly. If the second, then learn AngularJS.

In any case, you should know some basics about JavaScript, HTML, and CSS. Udacity has a good series of video courses about that.

I can help you with this specific problem, and tell you how to solve it, probably. But you will find others like this on the road if you don't cover the basics. Good luck, and happy coding.

Collapse
 
thenewave profile image
thenewave

Thanks, this is pretty helpful. I come from a Java background and have to work with AngularJS. I actually tried to code onFormatChange as a function instead of a variable before, with $resource, $http, and 'ServerURL' as arguments for it. Will try again now that its more clear.

Collapse
 
sebastiandg7 profile image
Sebastián Duque G

Any particular reason of using AngularJS and not Angular?

Collapse
 
muhammedmoussa profile image
Moussa

There are many, if you have a stable old project you never touched if there is small update.

Collapse
 
thenewave profile image
thenewave

Its a web app from 2015 and the client is asking for new features, but doesnt want a new language

Why You Need to Study Javascript Fundamentals

The harsh reality for JS Developers: If you don't study the fundamentals, you'll be just another “Coder”. Top learnings on how to get to the mid/senior level faster as a JavaScript developer by Dragos Nedelcu.