adjusting json format send by extjs form - json

I have a question.
I need to send a json format to my backend service. It requires something i haven't managed to create. What i am sending with a form is this:
{
"jobs": {
"name": "dsvs",
"jobType": "CUSTOM",
"description": "sdvsdv",
"tasks": "14,15,16"
}
}
but what i need to send is
{
"jobs": {
"name": "dsvs",
"jobType": "CUSTOM",
"description": "sdvsdv",
"tasks": [14,15,16]
}
}
how can i do this?
This is my form handler:
handler: function () {
var form = this.up('form').getForm();
var formData = Ext.encode(form.getValues());
Ext.Ajax.request({
url: ND.url + 'dna/rjs/secure/service/rest/jobs.json',
method: 'POST',
waitTitle: 'Connecting',
waitMsg: 'Sending data...',
jsonData: {
jobs: form.getValues()
}
});
})
I hope anyone has an idea!

You can't by "honest" ways.
You can, however, hack it into that one.
handler: function () {
var form = this.up('form').getForm();
var formData = Ext.encode(form.getValues());
formData.jobs.tasks = formData.jobs.tasks.split(',');
Ext.Ajax.request({
url: ND.url + 'dna/rjs/secure/service/rest/jobs.json',
method: 'POST',
waitTitle: 'Connecting',
waitMsg: 'Sending data...',
jsonData: {
jobs: formData
}
});
})
You don't use your formData in your example, despite having it, BTW.
That would result in:
{
"jobs": {
"name": "dsvs",
"jobType": "CUSTOM",
"description": "sdvsdv",
"tasks": ["14","15","16"]
}
}
If that is still not suitable, than you can further hack it by calling parseInt on each task value.
EDIT:
Added clarification.

Related

Printing Ajax results in HTML

I have this J Query code:
$(document).ready(function(){
var $outData = $('#data');
var ajaxUrl = 'url.json';
$.ajax(
{
type: 'GET',
url:ajaxUrl,
success: function (result) {
console.log(result.passwords);
}
})
}
);
JSON file looks like this:
{
"passwords":[
{
"value":"tom",
"count":"432517"
},
{
"value":"anaconda",
"count":"454658"
},
{
"value":"111111",
"count":"148079"
},
What I need to do, is to print out each of these objects to be printed out in an ordered list (for instance it should look like this:
tom 432517
anaconda 454658
111111 148079
So far, nothing I have tried works. Althoug, I can console.log the entire object. Any suggestions?
Example rendering:
var $outData = $('#data');
var ajaxUrl = 'url.json';
$.ajax(
{
type: 'GET',
url:ajaxUrl,
success: function (result) {
result.passwords.forEach(pwd => $outData.append(`<div>${pwd.value} ${pwd.count}</div>`));
}
})
}
);
you can create elements and append to dom when you are done,
const data = {
"passwords": [{
"value": "tom",
"count": "432517"
},
{
"value": "anaconda",
"count": "454658"
},
{
"value": "111111",
"count": "148079"
}
]
}
const ol = document.createElement("ol");
for (const {
value,
count
} of data.passwords) {
const li = document.createElement("li")
li.innerText = `${value} -> ${count}`
ol.appendChild(li)
}
document.querySelector("#root").appendChild(ol)
<div id="root"></div>

send header with put request node.js

var request=require('request');
var values = [
{
"id": "24",
"kind": "nature",
"data": {}
}
]
request.put("http://localhost:5000/api/article/",values,function (err,data,res) {
res=JSON.parse(res)
console.log(res)
})
I think it's kinda obvious what I'm trying to do here. Can someone please tell me what I'm doing wrong?? If I'm verry far of can someone set me on the right track?
var request = require('request');
var values = [
{
"id": "24",
"kind": "nature",
"data": {}
}
];
request({
method: 'PUT',
url: 'http://localhost:5000/api/article/',
body: values,
json: true,
headers: {
'User-Agent': 'request'
}
}, (err, res, body) => {
// ...
});
See the docs: https://www.npmjs.com/package/request#custom-http-headers

ExtJS 6 Rest Proxy where JSON Data Object is ID

I'm hoping someone can guide me on how to deal with this json data structure.
Here's an example of that: (I have zero control of this data)
{
"1": {
"name": "thing 01",
"attributes": {
"color": "red",
"brand": "ACME"
}
},
"2": {
"name": "thing 02",
"attributes": {
"color": "blue",
"brand": "ACME"
}
}
}
So I'm confused about how to get the records using the reader
Ext.define('MyApp.model.Thing', {
extend: 'Ext.data.Model'
fields: [
{ name: 'name' },
{ name: 'attributes', type: 'auto' }
],
proxy: {
type: 'rest',
url: 'http://example.com/api/things',
reader: {
type: 'json',
rootProperty: ??? // <--- How should this work?
}
}
});
I've wondered if there's a way to do something like...
rootProperty: '[id]'
Also is there a way to specify the ID when it is the data object? Maybe somehow using the idProperty config on the Model?
Should I use the reader.format method? That would seem a little gross...
Any ideas are apreciated. Thanks!
Write a custom reader class:
Ext.define('MyReader', {
extend: 'Ext.data.reader.Json',
alias: 'reader.myreader',
config: {
transform: function (data) {
var ret = [],
key, o;
for (key in data) {
o = data[key];
o.id = key;
ret.push(o);
}
return ret;
}
}
});
Ext.define('Thing', {
extend: 'Ext.data.Model',
fields: ['name', 'attribute'],
proxy: {
type: 'ajax',
url: 'data1.json',
reader: {
type: 'myreader'
}
}
});
Example fiddle.
Your EXACT question is already answered here.
You should implement a custom reader and override the getResponseData method.
Ext.define('MyReader', {
extend: 'Ext.data.reader.Json',
alias: 'reader.myreader',
getResponseData: function(response) {
var data = this.callParent([response]);
//do stuff here
return data;
}
});

Sencha touch2: How can i parse my nested json data?

i could not able to parse my nested json data and i tried in many ways but i could not succeed. any help is appreciated.
Here is my json output looks like:
[
{
"task": {
"locator": "FGWESD",
"subtask": [
{
"work": {
"number": "1145",
"id": "0",
"status": true,
"gate": "N\/A",
},
"sequenceNumber": "0",
"id": "0"
},
{
"work": {
"number": "1145",
"id": "0",
"status": true,
"gate": "N\/A",
},
"sequenceNumber": "0",
"id": "0"
}
],
"connectTime": "0",
"id": "0"
}
}
]
Here is my model:
Ext.define('MyApp.model.MyModel',{
extend:'Ext.data.Model',
xtype:'myModel',
config:{
fields:[
{name:'number',mapping:'work.number'},
{name:'id',mapping:'work.id'},
{name:'locator',mapping:'task.locator'},
{name:'gate',mapping:'work.gate'}
]
}
});
Here is the store:
Ext.define('MyApp.store.StoreList', {
extend:'Ext.data.Store',
config:{
model:'MyApp.model.MyModel',
storeId: 'id_Store',
// added the url dynamically inside the controller
proxy:{
type:'ajax',
reader:
{
type:"json",
rootProperty: 'subtask'
},
method: 'POST',
actionMethods: {
create : 'POST',
read : 'POST', // by default GET
update : 'POST',
destroy: 'POST'
},
headers :{
"Content-Type" :'application/xml',
'Accept':'application/json'
}
}
}
});
Here is my controller code :
Ext.define('MyApp.controller.LoginController', {
extend: 'Ext.app.Controller',
requires: ['Ext.data.proxy.Rest'],
config: {
// My code is too long to add here so am adding store loading when user taps login button
},
getDetails: function(){
var segmentStore = Ext.create('MyApp.store.StoreList');
var url = 'http://localhost:8080/apps';
segmentStore.getProxy().setUrl(url.trim());
segmentStore.load({
scope:this,
callback: function(records, operation, success){
if(success){
console.log('records: ',records);
console.log('records: '+records.length); // prints here 1
console.log('locator: '+records[0].getData().locator);
// prints FGWESD
console.log('locator: '+records[0].getData().number);
//prints undefined
//
}
}
}
)
},
});
Can any one please help me out. how can i get Values of number, gate, id and status?
What are the necessary changes have to be made in model, store and controller ?
Please help me out in resolving ? Thanks.
As I wrote in a comment, I don't think you can achieve that without manually parsing the data and loading it to the store. So the getDetails function should look like this:
getDetails: function(){
var segmentStore = Ext.create('MyApp.store.StoreList');
Ext.Ajax.request({
url: 'http://localhost:8080/apps',
success: function(response){
var responseObj = Ext.decode(response.responseText);
var task = responseObj[0].task;
var locator = task.locator;
var subtasks = [];
Ext.each(task.subtask, function(subtask) {
subtasks.push({
number: subtask.work.number,
id: subtask.work.id,
gate: subtask.work.gate,
locator: locator
});
});
segmentStore.setData(subtasks);
}
});
}
Also, when using this method you should remove the mapping from your model, and you can get rid of the proxy definition of the store. Also, I'm not sure why you want to create the store in the "getDetails" and not define it in the 'stores' config of the controller, but maybe you have your reasons..
I didn't run the code, so there maybe errors, but I hope you get the idea.
I think the root property of your store should be:
rootProperty: 'task.subtask'

how to add json to backbone,js collection using fetch

I am trying to get backbone.js to load json.
The json loads but i am not sure how to get the items into my collection.
Or maybe that happens automatically and i just can't trace out. scope issue?
//js code
//model
var Client = Backbone.Model.extend({
defaults: {
name: 'nike',
img: "http://www.rcolepeterson.com/cole.jpg"
},
});
//collection
var ClientCollection = Backbone.Collection.extend({
defaults: {
model: Client
},
model: Client,
url: 'json/client.json'
});
//view
var theView = Backbone.View.extend({
initialize: function () {
this.collection = new ClientCollection();
this.collection.bind("reset", this.render, this);
this.collection.bind("change", this.render, this);
this.collection.fetch();
},
render: function () {
alert("test" + this.collection.toJSON());
}
});
var myView = new theView();
//json
{
"items": [
{
"name": "WTBS",
"img": "no image"
},
{
"name": "XYC",
"img": "no image"
}
]
}
Your json is not in the correct format, you can fix the json or add a hint to backbone in the parse method:
var ClientCollection = Backbone.Collection.extend({
defaults: {
model: Client
},
model: Client,
url: 'json/client.json',
parse: function(response){
return response.items;
}
});
Or fix your JSON:
[
{
"name": "WTBS",
"img": "no image"
},
{
"name": "XYC",
"img": "no image"
}
]
If you use rest api, try turn off these parameters:
Backbone.emulateHTTP
Backbone.emulateJSON