How to use AngularJS with Struts 1.x - angularjs

I'm new to AngularJS and client side stuff and I'm adding a new page to an old application that uses Struts 1.3 as its framework. I would like to use AngularJS for the front end.
I know how to return JSON from the action class by writing the JSON to the front end and returning null for the action forward. However, I'm unclear how I would populate the scope variables within the controller after the GET. If I use a GET in the controller and get JSON back, how does my ActionForm fit into all this? Is it useful at all? Can I have a GET and POST for the same controller if I want to send new values back to my action? And, can I have variables like:
$scope.items={}
$scope.items.name=""
$scope.items.email=""
And then just send json.stringify(items) as my data in the POST if I can't use the form somehow?
I haven't found much information using AngularJS with Struts 1.3 so far.
EDIT:
I'll try to answer as best as possible what conclusion I came to but my questions above were very vague since I didn't really know what I was talking about and my position with the company I worked for has ended so I no longer have access to that code. What I meant to ask earlier was what am I going to do with the action form that I usually use for Struts actions and how am I going to get data from the front end to my action class during a POST. I found out that my usual ActionfForm was useless for what I wanted to do so I got rid of it and wrote a JSON object during the GET that would be modified on the frontend and passed back to another action when I did the POST. This is done like a normal POST to whateverAction.do, but I had to configure the data I was sending in the POST and name it something. I then picked up the modified JSON object by using
request.getParameter("jsonObjName")
and parsed it to different LinkedHashMap objects for each object in the JSON object. I think you can use the JSONObject classes instead of LinkedHashMap to parse if you are using JavaEE but I was using SE so I didn't have access to those in this project. Here a link to another page I used for the POST configurations:
How to get the data in Struts from AngularJS post

On the Java side you can also try to use Gson library that allows you to parse string to and from JSON, but Struts 1 generally won't fit well with AngularJS, if you remove the form on Java side, than makes no sense to keep Struts 1.
And if no possibility to remove Struts 1, than just keep Struts 1 for existing functionality and start using Struts 2 for new screens where AngularJS is applied.
It will be much easier cause the JSON from AngularJS' POST will automatically be bound to the bean object that has to match to JSON properties format and name.

Related

2sxc - Getting URL path from DNN link parameter / Tab ID

I am working on integrating a 2sxc content WebAPI feed into a ReactJS application.
I have managed to get a JSON feed of data into the application, and am in the process of mapping out the data.
I'm wondering what the best practice would be to "resolve" a URL which is coming through as a DNN Page/ Tab ID.
Below I will showcase the various points this is referenced...
First the Setup of the entity / data types...
Then this is an example entry with the data filled out... The page link / URL is set up to point to another internal page on the DNN website:
Finally you can see this data item come through as a JSON feed via the 2sxc API:
What is the best way to convert this piece of data into a URL which can be used in a SPA type application?
There isn't any "server-side" code going on, just reading a JSON feed on the client side...
My initial idea would be to parse this piece of data in JS, to extract the number then use something like this:
http://www.dotnetnuke.com/tabid/85/default.aspx
http://www.dotnetnuke.com/default.aspx?tabid=85
I was hoping someone with more experience would be able to suggest a better / cleaner approach.
Thanks in advance
If you were server-side in Razor you'd be doing something like this:
#using DotNetNuke.Common
View List
XXXX = Dnn.Tab.TabID or define a string with the tab id you want
I seem to have a vague memory that I saw somewhere that Daniel (2sxc) has a way to use Globals.NavigateUrl() or similar on the client side, but I have no idea where or if I did see that.
The Default.aspx?tabid=xx format will certainly work, as it's the oldest DNN convention and is still used in fallbacks. The urls aren't nice, but it's ok.
The reason you're seeing this is because the query doesn't perform the automatic lookup with the AsDynamic(...) does for you. There is an endpoint to look them up, but they are not official, so they could change and therefor I don't want to suggest that you use them.
So if you really want a nicer url, you should either see if DNN has a REST API for this, or you could create a small own 2sxc-api endpoint (in the api folder) just to look that up, then using the NavigateURL. Would be cool if you shared your work.

How to consume Spring Data Rest Webservices API with AngularJS

i had been working in a Spring Rest Data API in an application (just for fun).
I have the core made, works fine but now I want to use AngularJS as front-end.
I had work with Jackson (Mapping Java Objects to JSON), but with Spring Rest Data the Json response it's diferent, it has _embedded, _links, self, etc. links that make me confuse. I have something like this in the root url http://localhost/8080/app/api/tarifas
I have used a JS script called restangular but i have serveral problems (I'm newbie with Angular)
In my controller i have this
Check the error
If I add a RestangularProvider in my app.config(...) and change the Controller to getList instead get, works fine, but I need several entities data formats.
Any help it's welcome. If you know a better way please tell me.
Thanks!!
UPDATE
I found a form to do this (i don´t know if it's the better) but now my problem is the next:
I have objects that has other objects as attributes (realtionship), and the reference in the JSON is a link (not an object). Then, in the grid; the value of the description's internal object is blank. To get the json data I found this
Now I have the next content for one register (one of the grid)
And my grid (In Angular, HTML) looks like this (empty fields)
How can I retrieve the attribute description from the member estado, categoria, etc. and show it in the grid. Should make the request to get it?
Thanks!!
You can use either angular.toJson or json.stringify
Angular-toJson documentation
Json.stringify documentation

Save data to server using BackboneJS

I am very new to BackboneJS. I am creating a simple CRUD application using BackboneJS.
I have seen an example on the web (http://backbonetutorials.com/videos/beginner/). I can see a GET request on load of application i.e. http://backbonejs-beginner.herokuapp.com/users to get all the users in JSON format.
I just wanted to know what is this url (http://backbonejs-beginner.herokuapp.com/users).
Can someone help me to understand where and how data is getting saved?
What do I need to do, if I want to do the same thing on my localhost?
Do I need to write any server side code in order for this to work?
The url in the example is (one of) the API endpoints that the demo application interacts with in order to function. Backbone.JS will allow you to fetch and save data in many different ways (by writing a connector yourself) but the default means of getting and setting Model data for backbone is through AJAX calls to a RESTful API.
So lets take a look at this code snippet:
MyModel = Backbone.Model.extend({});
MyModelCollection = Backbone.Collection.extend({
model: MyModel,
url: '/myserver/api'
});
Note the "url" configuration option on the Collection. That is the URL that Backbone will make calls to (GET,POST and others) in order to get and set data for the application. That URL should be provided by you in most cases - especially if you are the one building the application.
So in short...yes, you will need to write some server side code for your CRUD application to work. I would suggest watching the REST tutorial I linked above and then consulting these articles which provide a bit more detail about how Backbone models are supposed to work.
What is a Model
Collection URL option
Model URL option
Backbone Model - Save
The server side code is needed.
But if you just want some data not matter they are real or fake. What don't you just create a object with fake data and set the Model or Collection with them. This is more easier than setting up a backend.

Web API null parameter value in POST action

I'm trying to use angular and asp.net vNext Web API. I have a controller up but when using angular's $resource the object values are not resolved (Post method parameter is null)
The request itself has nothing out of the ordinary, though it does send json back. I think I've seen somewhere that vNext doesn't support content negotiation yet so maybe that's it. Can anyone confirm or shed some light on the subject?
Also - is there a way to get to the raw post data in Web API? (I'm using the core framework) cause the Request.Form that I know from mvc is not there any more. I tried the GetFormAsync but that returns an empty collection.
EDIT:
Confirmed that the reason for not binding the parameter is the fact that data is sent as JSON. When form encoding is used, the parameter values are resolved correctly.
using [FromBody] attribute on the param solved the issue.

extjs 4 rest proxy and zend 2 restful controller

I want to post data to Zend 2 restful controller from EXTJS 4 rest proxy.
But when I inspect with the firebug I found that there is the post data ,but I am not able to fetch that data .How to get that post data to use it in my methods.
Where I am getting wrong I cant figure it out.
Anyone having steps to post data from rest Extjs 4 proxy method to Zend?
The standard way in PHP to load JSON from the HTTP Request Body is to use
$some_json = file_get_contents('php://input');
$some_object = json_decode($some_json);
I don't know whether Zend2 has their own way of doing it.
ExtJS send params like sort, page, filter, etc. into the URL, e.g.: http://myhost.com/?page=2&sort=myfield.
In this case you simply need to intercept the query params from your RESTController Action:
$page = $this->params()->fromQuery('page');
$sort = $this->params()->fromQuery('sort');
Data transmission to a ZF2 REST controller depends on the HTTP Method you are using:
GET, PUT, DELETE receives an $id argument;
POST used to create a new record and receives a $data argument.
For further information you can have a look in here:
http://framework.zend.com/manual/current/en/modules/zend.mvc.controllers.html#the-abstractrestfulcontroller
If you are interested, I am developing my REST proxy for Sencha, I have tested with ExtJS and Sencha Touch frameworks and it supports pagination, remote filters, remote sorting and so on.
It's developed with Zend Framework 2 and may support different DB types on the same installation. Have a look at:
http://apiskeleton.asaconsult.com/
I have exactly the same problem. Now, the reasons why the previous replies don´t work is because Zend Studio 10 has a new feature for configuring REST services from a visual editor that receives parameters and creates routes. This service designer is actually accepting the parameters form the body for the POST action of the Restful service but it somehow ignores the JSon sent from ExtJS. To make things worse, if you test the service using the integrated GUI in Zend Studio 10 it works perfectly and the JSon produced is 100% the same as the one from ExtJS ( I actually performed some data transforms to get to that point ), and it doesn't work.
The real issue is that there is 'something' within the POST method that is different in the ExtJS Request, than the JSon being expected from the framework itself that abstracts the code for deserializing this JSon from the developer.
The real question is, What is the Zend Server Gateway library expecting that ExtJS is sending in a different way in the POST body? I would enormously appreciate if any of the thousands of experts here could please check that out and come with a correct answer. The one that will answer this will have to have or to download a trial of Zend Studio 10 and check for himself how the Visual Service Tool that comes with ZS10 works. I have found so far that ExtJS4 produces it´s JSon like this:
{"data":
{"IdCurso":"0","Nombre":"NodeJS","IdEstadoCurso":"1",
"IdTipoPeriodo":"1","CantPeriodo":"1","CantAsignatura":"1","IdPlantel":"1"}
}
And the Zend GUI for testing the service, produces (and the service accepts) JSon like this:
{
'data' : '{"Nombre":"NodeJS","IdEstadoCurso":"1","IdTipoPeriodo":"1","CantPeriodo":"1","CantAsignatura":"1","IdPlantel":"1","IdCurso":"0"}'
}
As you can see data is enclosed on single quotes, and its content is as well for Zend Framework to consume it without issue. ExtJS uses double quotes, as well as is not quoting the content of the data package itself.
This is a Patch that actually works, Not the definitive solution, if somebody finds a better one, that would be great.
Try this as the first instruction in your add() (POST) method:
$data = json_decode($this->getRequest()->getContent());
You may need to add afer that:
$data = (array) $data;
After that, keep writing your code with the $data variable normally as you would do if the parameter would actually work.

Resources