How to convert html response into json - json

I want to put received html response into existing json.
I have 2 pages. From first page i send post request with ajax.
At the second page i process post and read data with mysq then i echo the data and send them as response back to first page.
Again at first page i want to use this incoming response and fit it into the json.
you can view image below. this is how it looks when i write it ot the console but when i assign the value to data json object, nothing happens.
var data = {
'type': 'FeatureCollection',
'features': [{
'type': 'Feature',
'geometry': {
'type': 'Point',
'coordinates': [26.800394, 39.616144]
},
'properties': {
'title': 'Durum',
'description': '26.800394, 39.616144'
}
}, {
'type': 'Feature',
'geometry': {
'type': 'Point',
'coordinates': [28.879391, 39.418753]
},
'properties': {
'title': 'Durum',
'description': '28.879391, 39.418753'
}
},]
};
map.on('click', function(e) {
$.ajax({
type: "POST",
url: "load_data_3.php",
data:
"request=request",
success: function (response) {
value = response;
console.log(value);
},
});
data = value;
map.getSource('earthquakes').setData(data);
});
// This is the data received and then writtend to the console (This is what i see)
enter image description here

Related

ExtJs Form.submit() response does not have responses json body

I have form like
items: [{
xtype: 'form',
itemId: 'form',
bodyPadding: 5,
url: 'upload',
items: [{
xtype: 'fileuploadfield',
name: 'file',
fieldLabel: 'label',
emptyText: 'enter',
labelWidth: 60,
width: 590,
msgTarget: 'side',
allowBlank: false,
buttonText: 'browse'
}],
buttons: [
{
text: 'upload',
itemId: 'loadButton'
}]
}]
and click handler
onLoadBtn: function (button) {
var form = button.up('form').getForm(),
if (form.isValid()) {
form.submit({
scope: this,
submitEmptyText: false,
fileupload:true,
success: function (form, action) {
var response = Ext.JSON.decode(action.response.responseText, true);
if (response.success) {
Ext.Msg.show({
title: 'success',
msg: response.message,
buttons: Ext.Msg.OK,
icon: Ext.Msg.INFO
});
} else {
this.error(response.message);
}
},
failure: function (form, action) {
var response = Ext.JSON.decode(action.response.responseText, true);
this.error(response.message);
},
});
}
},
Endpoint from server side return response with json body
{"success" : "true", "message" : "Success"}
, but in browser network response body is empty.
Request have header
Accept : 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8'
If i change it to
Accept : 'application/json'
and resend request, i got a response with right json body.
Any ideas, what need to change in the form or handler, so that change the accept header?
Resolved. Responses body has been disabled by response header
X-Frame-Options: DENY
Thanks!

How to save data in json file?

I need to save JSON data into a .json file after converting an object to a string using JSON.stringify
This is my current code:
const jsonObject: object = {
'countryName': 'Switzerland',
'users': [
{
'id': 1,
'name': 'Basel',
'founded': -200,
'beautiful': true,
'data': 123,
'keywords': ['Rhine', 'River']
},
{
'id': 1,
'name': 'Zurich',
'founded': 0,
'beautiful': false,
'data': 'no',
'keywords': ['Limmat', 'Lake']
}
]
};
const myData = JSON.stringify(jsonObject);
Note: I want to save this data dynamically, and I was used to jsonConverter of jsonTypescript2.
I tried using this method:-
let a = document.createElement('a');
// JSON.stringify(jsonObject), 'ex.json' // another
a.setAttribute('href', 'data:application/json;charset=UTF-8,' + encodeURIComponent(myData));
Okay after 6 days ago I discover best solution, how to connect between Angular 6 and Node.js + json File directly and dynamically .
npm install file-saver --save
import { saveAs } from 'file-saver';
const jsonObject: object = {
'City': [
{
'id': 1,
'name': 'Basel',
'founded': -200,
'beautiful': true,
'data': 123,
'keywords': ['Rhine', 'River']
},
{
'id': 1,
'name': 'Zurich',
'founded': 0,
'beautiful': false,
'data': 'no',
'keywords': ['Limmat', 'Lake']
}
]
};
const blob = new Blob([JSON.stringify(jsonObject)], {type : 'application/json'});
saveAs(blob, 'abc.json');
You can use fs.js NPM module to write data to file
There are a lot of details in the filesystem API. The most common way (as far as I know) is:
var fs = require('fs');
fs.writeFile("/fileName.json", myData, function(err) {
if(err) {
return console.log(err);
}
console.log("The file was saved!");
});

How to send array of objects to a controller method?

I need your help, I have this piece of code in the controller side
public bool DraftMessage(message[] draftMessages, HttpPostedFileBase[] files = null)
{
return true;
}
and I use this client side code to send the data
function DraftMessage()
{
var myArray = [{ 'To': [1, 2], "Title": "Hello" }, { 'To': [1, 2], "Title": "Hello" }]
$.ajax({
type: "POST",
url: "#Url.Action("DraftMessage","Activities")",
datatype: "json",
traditional: true,
data: JSON.stringify({ draftMessages: myArray }),
beforeSend: function () { }
}).done(function (data) {});
}
$("input, select, textarea").change(function () { DraftMessage(); });
var contents = $('.note-editable').html();
$(".compose-message").on("blur", ".note-editable", function () {
if (contents != $(this).html()) {
DraftMessage();
contents = $(this).html();
}
});
but when I debug it I found that the array of messages in the controller is null so could anyone guide me about what I did wrong and help me to fix this issue.
You need to set contentType as "application/json"
function DraftMessage() {
var myArray = [{ 'To': [1, 2], "Title": "Hello" }, { 'To': [1, 2], "Title": "Hello" }];
$.ajax({
type: "POST",
url: "#Url.Action("DraftMessage","Home")",
contentType: "application/json",
data: JSON.stringify({ draftMessages: myArray })
}).done(function (data) {
console.log(data);
});
}
The default value of contentType header is "application/x-www-form-urlencoded" . Since we are sending the json stringified version of a a complex data structure, we should explicitly specify the contentType

EXTJS how to let json post with square bracket even 1 object only

var RouteSeqStore = Ext.create('Ext.data.JsonStore', {
model: 'RouteSeqModel',
storeId: 'RouteSeqStore',
autoLoad: false,
sorters: [{
property: 'Route_Seq',
direction: 'ASC'
}],
proxy: {
type: 'ajax',
url: 'route/get-routeseq.php',
api: {
destroy: 'route/delete-routeseq.php',
create: 'route/insert-routeseq.php',
//read: 'http://visual04/ModuleGestion/php/Pays.php?action=read',
update: 'route/update-routeseq.php',
},
actionMethods: 'POST',
baseParams: {
_id : 0,
},
reader: {
type: 'json',
idProperty: '_id'
},
writer: {
type: 'json',
id: '_id'
}
}
});
this is my EXTJS post json code, when posting 1 object, extjs wont have square bracket
{"_id":11,"Route_Seq":1,"Location_Name":"B.STATION","Route_LocationID":"1","Route_ID":"2","id":null}
when multi array json result will having the [ ] bracket, how to let JSON post with square bracket even 1 object only
what i expect the result is :
[{"_id":11,"Route_Seq":1,"Location_Name":"B.STATION","Route_LocationID":"1","Route_ID":"2","id":null}]
any solution?
Simple: just set the allowSingle config on your writer to be "false". This will force the writer to send model instances as an array ALWAYS, regardless of the number being persisted in any given request. Be sure to check out the docs for this.

Simple JSON example with senchaTouch

I'm trying to achieve a simple JSON operation:
I want to write on my page a text coming from a file in JSON format.
The file is like this: (data.json)
{
"id": "0",
"name":"myname"
}
The script is getting the JSON:(main.js)
Ext.setup({
onReady: function() {
Ext.regModel('Person', {
fields: [
{name: 'id', type: 'string'},
{name: 'name', type: 'string'}
]
});
//I want the name to be written on the page
var itemTemplate = new Ext.XTemplate(
'<tpl for=".">',
'{name}',
'</tpl>');
// I get and decode the Json from data.json
var jsonStore = new Ext.data.Store({
model: "Person",
proxy: {
type: 'ajax',
url: 'data.json',
reader: {
type: 'json'
}
},
autoLoad: true
});
// The panel should get the stored Result and display it
var jsonPanel = new Ext.Panel ({
title: "json",
fullscreen: true,
items: [
{
xtype: 'list',
store: jsonStore,
itemTpl:itemTemplate,
}
]
});
}
});
The index.html file calls all the files above and sencha-touch.js and .css.
I just don't manage to see anything written on the page.
If someone can give me a clue about what i am doing wrong it would help a lot.
Try to put your JSON objects in array notation, like this:
[{
"id": "0",
"name":"myname"
}, {
"id": "1",
"name":"myname2"
}]
As far as I can remember (at least that was the case in ST1, I did not try with ST2), the Ajax reader cannot be used to access local files. You need to have your json data delivered through a web server