SAPUI5 OData - How to create new entry with association to existing entity? - javascript

I am currently using SAPUI5/OpenUI5 to consume and modify OData Services.
I want to create a new product entry over an HTTP POST Request and have problems to properly config the associations to a category. For developing reasons I am using a reference OData Service with this metadata. The Product already has the NavigationProperty to the right Category EntrySet.
<NavigationProperty Name="Category" Relationship="ODataDemo.Product_Category_Category_Products" FromRole="Product_Category" ToRole="Category_Products"/>
I am using the following JavaScript code in my controller:
var oCategory = oModel.getData("/Categories(0)");
var oEntry = {};
oEntry.ID = "10";
oEntry.Name = "Beer";
oEntry.Category = oCategory;
oModel.create("/Products", oEntry, {
method: "POST",
success: function(data) {...},
error: function(response) {...}
});
The product is successfully created /Products(10) but the relation to the existing category /Products(10)/Category is not working properly. Instead a new category with the same ID and information is created (is this meant with 'deep insert'?) but I want to use the elected category (of course).
Do I have to reference the category differently or can I create the associations manually somehow? Shouldn't the OData Service check if the category ID already exists and then use the existing entry?
Is there any best practices for such cases?

It's important to note that you are using an OData V2 service. Yes, by building the request the way you are doing it, you are actually doing a deep insert.
If you think about it, it makes sense, because you would not need to send the whole category information to just link the new product to the exiting category. What if you would change something in the category data? Should a deep insert result in an update?
In any case, OData v2 has something called "links" (see the OData terminology - www.odata.org). Basically each "association" between entities is represented through such a link. You can manage these links separately from the entity (e.g. you can remove and create links between existing entities; without having to change the entity itself - see the OData v2 operations, chapters 2.9 to 2.12).
Depending on the data format that you are using (by default, JSON if you are using sap.ui.model.odata.v2.ODataModel), you can create entity links in the same time when creating new entities. Check out this answer: https://stackoverflow.com/a/4695387/7612556.
In a nutshell, you would have to write something along the lines of:
oModel.create("/Products", {
ID: "10",
Name: "Beer",
Category: {__metadata: {uri: "/Categories(0)"}}
}, {
method: "POST",
success: function(data) {...},
error: function(response) {...}
});

Related

How effectively updatie complex large object in REST?

Suppose I have a complex object from html page which is mapped to this JSON structure:
{
id:"", //is not shown to user
title : "",
description: "",
summary: "",
// other too many fields
}
To update this record with "common" REST approach I should use:
- POST rest/record/{id}
With "common" approach entirely record object is marshalled to JSON object and is passed to REST service, then this entirely object is validated, passed to SQL query to data base and DB engine updates a record with all data. But what if user just update one symbol in the title?
In that case I should split this object into several:
{
id:"", //is not shown to user
{ recordId:"", title : "", } ,
{ recordId:"", description: "", } ,
{ recordId:"", summary: "", } ,
// other too many fields
}
How I should reorganize rest URLs? Like that:
- POST rest/record/{id}/title
- POST rest/record/{id}/description
- POST rest/record/{id}/summary
- others
Is this approach with URL good or bad (I mean both for javaScript from end and REST back end programming)? Is there any other approaches to handle this problem?
Instead of using POST, use PATCH and send only what's been changed:
PATCH rest/record/{id}
Data: { title: "new title" }
URLs such as rest/record/{id}/title, rest/record/{id}/summary, etc. aren't really RESTfull since they are not resources but properties of a resource.
See this past question for some exploration of options here (include PATCH).
Best practice for partial updates in a RESTful service
You have the following options:
use PATCH and send only the title
use PUT and send the whole data again
use PUT and use the property as a sub-resource with url: /resource/title
(POST is not idempotent, so you should not use that for update)

Ember.js Search Model Verbs

The tutorials & guides that I've found suggest that Ember.js models are very data centric, in that you have data in the browser that is persisted to the server and/or a model is filled with data from the server.
How about something that is more verb centric? For example, my case is that, so far, I have a "Search" model, where a search has a query, a state ("beforesearch","duringsearch", etc...), and, hopefully, some results. I want for the search to then "runQuery", which fires off an ajax request to the server, which returns and fills the model with the results, and changes its state to "aftersearch".
What's the best way of handling such verbs on models? Should the "runQuery" go via ember-data, or just manually fired off using $.ajax or similar? Am I maybe thinking about models in the wrong way, and this should actually go via a controller?
Edit: After reading up a bit on REST, I think what I'm wanting is to POST to a "controller" resource. So, for example:
POST: /searches (to create a search)
POST: /searches/1/run (to execute search 1's "run" controller
Does Ember.js / ember-data have a recommended way of calling controller resources like this?
Ember-data is very oriented around using model objects that contain various information fields and relationships and are defined by a unique id. Half of my API is like what ember-data expects and half is like you described, it is more about data processing or performing a calculation than creating/retrieving/updating/deleting a data object that has an id. It doesn't make sense to treat these calculations the same and assign it an id and persist it in the database.
In my case, since I have both ember-data style data objects and calculation functionality I use a mix of ember-data and custom ajax requests. I have relational data stored that is retrieved by ember-data but I augment the models to include access to the calculation portions.
For example:
App.Event = DS.Model.extend({
name: DS.attr('string'),
items: DS.hasMany('App.Item'),
...etc...
searchData: null,
searchInEvent: function(data) {
var _this = this;
return $.ajax({
url: "/api/events/" + this.get('id') + "/search/",
dataType: 'json',
type: 'POST',
data: data
}).then(function(result){
_this.set('searchData', result);
});
}
});
App.Event is a normal ember-data model and is loaded by the router through the usual ember conventions, and as the various controllers need access to the search functionality they can access it through searchInEvent and searchData that were added to the model.

How to default construct JavaScript object from JSON Schema?

I've started using Newtonsoft.Json.Schema.JsonSchemaGenerator along with various property attributes over in my C# code to help keep my client script DRY. What I'd like to do is create a default initialized object client-side based on the schema from the server. This would be useful for, say, when the user clicks 'New Foo' to add a new entry into a table.
Obviously I can just code it up to iterate the .Properties and build up the new object, which is what I'm doing at the moment. However I'd prefer to avoid reinventing any wheels.
Are there any JS libraries for working with JSON schema that will do this, among other nifty things I've yet to realize I need?
1/29/2013 UPDATE
Some people have attempted to answer my question and have been off base, and as a result have received some negative feedback from the SO community. So let me attempt to clarify things. Here is the challenge:
In JS client script, you have an object that represents the JSON Schema of another object. Let's say, this came from the server via JSON.NET and is the representation of a C# class.
Now, in the JS client script, create one of these objects based upon the JSON Schema. Each field/property in the object must be default initialized according to the schema, including all contained objects!
BONUS: Bind this new object to the UI using MVVM (eg Knockout). Change some of the fields in response to user input.
Send this new object to the server. The server-side code will add it to a collection, database table, whatever. (Yes, the object will be sent as JSON using Ajax -- we can assume that)
No duplication! The only place where the class is defined is in the server-side code (C# in my example). This includes all metadata such as default values, description text, valid ranges, etc.
Yes there is (I tried it with NodeJS):
JSON Schema defaults
Link updated.
i think...you have to use two way binding with your HTML code...so, once your client side change you will get on your costume js file.
check here for knockout js.
Knock Out JS Link
and on C# code use : $("#urlhidden").val() OR Document.GetElemenyByID("#urlhidden").val().
here you will get array/list or textbox value
Use json with Ko
create new viewmodel for knockout js which you will get the idea about on above link.
and create a json call
like:
self.LoadMAS_Client = function () {
try {
var params = { "clientID": ClientId };
$.ajax({
type: "POST",
url: "http://" + ServerString + "/Services/LogisticsAppSuite-Services-Web-Services-MasClientService.svc/Json/GetAllLevelSubClients",
contentType: 'application/json',
data: JSON.stringify(params),
dataType: 'json',
async: false,
cache: false,
success: function (response) {
// in response u will get the data.and use as per your requirement.
eg. self.SelectedClient(response.your value);
},
error: function (ErrorResponse) {
}
});
}
catch (error) {
}
};
================================New Update ==========================================
i think..one way you can do...get data on xml format at C# code and covert into json string...check below code // To convert an XML node contained in string xml into a JSON string
XmlDocument doc = new XmlDocument();
doc.LoadXml(xml);
string jsonText = JsonConvert.SerializeXmlNode(doc);
// To convert JSON text contained in string json into an XML node
XmlDocument doc = (XmlDocument)JsonConvert.DeserializeXmlNode(json);

How to retrieve Ext.data.JsonStore data in sencha

I have the following code -
var options = new Ext.data.JsonStore({
model: 'options_model',
data: [
{ id: 1, option1: 'Alope', status1: 'true',option2: 'Option2', status2: 'false',option3: 'Option3', status: 'false',option4: 'Option4', status4: 'false' }
]
});
Now how can I retrieve data of option ???
I suggest you put your data into maybe a filename.json file (this is to maintain the scalability and integrity of your code).
Anyway, wherever it is you store your data, this is the code you need:
Ext.Ajax.request({
url: 'path_to_ur_json_file_wrt_html_file/filename.json', //in my case it was data/xyz.json since my folder layout was : abc.html, app, data, lib, stylesheets; and my data.json was in the data folder :)
timeout:3000, //how long it shud try to retrieve data in ms
method:'GET',
success: function(xhr) {
jsonData = Ext.util.JSON.decode(xhr.responseText);
var data4u = jsonData.data[0].option1;
}
});
First, JsonStore is not really a class to use. It's internal to Sencha and may be removed at any time. You should use Ext.data.Store instead.
Second, many of the out-of-the-box components in Sencha receive a store as confguration options so you don't have to worry about the inner workings.
Finally, if you do need to access store's data, you can do so by using each, getAt or find methods, depending on your needs and the way you want to access your data (random access, sequential or search).
I suggest you to go over this documentation:Sencha 1.1 Documentation

Backbone.js without REST using ASP .net webservice

(sorry for the english)
I have a ASP .net webservice that get data from a oracle database returning JSON data.
TestWebService.asmx/getUserData
I test this using simply ajax request with jQuery
$.ajax({
type:"POST",
data:"{}",
dataType:"json",
contentType:"application/json; charset=utf-8",
url:"TestWebService.asmx/getUserData",
success:function(data){
console.log(data.d);
}
});
This work.
But now i want to try use Backbone.js
The Application have this: User data, Articles and Buy Order where a Buy order is a collection of Articles, so i think in this models for Backbone
User = Backbone.Model.extend({})
Article = Backbone.Model.extend({})
ArticleCollection = Backbone.Collection.extend({})
BuyOrder = Backbone.Model.extend({})
BuyOrderCollection = Backbone.Collection.extend({})
The Views are just 2. A Form where i show the User Data and inputs to add Articles and create the Buy Order and a Visualize view to show the Buy Orders where the user can see an check the content of one buy order clicking in the code.
The UserData, and part of the Article Data are get from the service: (User Data like name and Article Data like code, description, price, etc).
¿How can i populate the Backbone models with this data?
Thanks in advance.
So, basically, you want to override Backbone.sync. It is the thing that is currently doing your RESTful stuff (GET/POST/PUT/DELETE) via the $.ajax function as well. See how it is implemented by default: http://documentcloud.github.com/backbone/docs/backbone.html#section-134
As you can tell, it is really quite simple... about 30 or so lines of code to map create/update/delete/read to post/put/delete/get in $.ajax.
Now that you have seen how they do it, you just implement your own using the same pattern:
Backbone.sync = function(method, model, options) {
// your implementation
};
Once you do that, you are golden. Your models will do all the CRUD that you want them to, abstracted through your implementation of Backbone.sync.

Categories