Develop Reference

How to pass the path of my JSON using JStree? Can I use /create another treeview CRUD?

I'm using Jstree and trying to put my JSON to the code using a method who I created that get the path to the JSON but I don't have any success. Have another way using just ASP.net core to create a CRUD viewtree without using Jstree? If don't have, how can I make it works?
The code:
let data_2 = #Html.Raw(Json.Serialize(Model.texto2));
var teste = decodeURIComponent("#Html.Raw(Model.getFile())");
window.location = teste;
$(document).ready(function (){
//parte do ajax
//fim ajax
var dataJson = JSON.parse(data_2);
$('#html1').jstree(
{
"core": {
"themes": {
"variant": "large"
},
"max_children":2
},
"plugins": ["contextmenu", "dnd", "search",
"state", "types", "wholerow"],
"root": {
"valid_children": ["default"]
}
}
);
$('#html2').jstree(
{
"core": {
"themes": {
"variant": "large"
},
"max_children":2
},
"plugins": ["contextmenu", "dnd", "search",
"state", "types", "wholerow"],
"json_data": {
"ajax": {
"url": "",
"data": function (n) {
return {
id: n.attr ? n.attr("id") : 0
}
}
}
}
);
});
I tried to put my JSON (a simple JSON just to make it works firstly) into JStree to make a CRUD with the framework.
{
"root": {
"branche": "example"
}
}
Update: i finally solved my first problem! but now i have another problem:I need to transform that path (the get file()) into a URL path. How can i do it? The new edit:
$('#html2').jstree // "#Html.Raw(Model.getFile().Replace(#"\", "/"))", <-- the data
(
{
"core": {
"themes": {
"variant": "large"
},
'data':{
type: "POST",
url: "#Html.Raw(Model.getFile().Replace(#"\", "/"))",
contentType: "application/json; charset=utf-8",
success: function (data) {
data.d;
$(data).each(function () {
return { "id": this.id };
});
}
}
}
}
);

new persitent menu messenger node js

I am developing a bot in messenger, I need to change my previous persitent menu.
my old menu's code :
requestData = {
"setting_type": "call_to_actions",
"thread_state": "existing_thread",
"call_to_actions": [
{
"type": "postback",
"title": ......,
"payload": .....,
},
{
"type": "web_url",
"title": .....,
"url": ......,
},]};
but when I use the new form :
requestData = { "persistent_menu":[
{
"locale":"default",
"composer_input_disabled":true,
"call_to_actions":[
{
"title":.....,
"type":"nested",
"call_to_actions":[
{
"title":......,
"type":"postback",
"payload":......
},
]
},
]
},
{
"locale":"zh_CN",
"composer_input_disabled":false
}
]};
It doesn't work, I would be very grateful if you could help me.

Convert JSON string to JSON object so I don't need to change in the base jquery.dataTables.js

I'm using ASP.net MVC on the server side. Basically I have a model class, I normally JsonConvert.SerializeObject(DataTableModel) and send it back to datatables.js. After the conversion the json data looks like the following;
"{
"draw":1,
"recordsTotal":2,
"recordsFiltered":2,
"data":[
{"PONumber":"PO 1234","SupplierNumber":"SUP 123","SupplierName":"Supplier 1","ProductDescription":"SUND Salt & Pep Grinder 6/210g","POQuantity":"6","POUOM":"12","BatchQuantity":"18","BatchUOM":"24","ShelfDate":"2016/02/24","ExpireDate":"2016/03/15","CreatedDate":"2016/02/23","CreatedBy":"HORIZON.COM\\mohammadi","POReceiveDate":"2016/02/20","Notes":"Note 1"},
{"PONumber":"PO 1236","SupplierNumber":"SUP 124","SupplierName":"Supplier 2","ProductDescription":"365 Cinnamon Strick Whol 6/36g*","POQuantity":"6","POUOM":"12","BatchQuantity":"18","BatchUOM":"24","ShelfDate":"2016/02/25","ExpireDate":"2016/03/31","CreatedDate":"2016/02/23","CreatedBy":"HORIZON.COM\\mohammadi","POReceiveDate":"2016/02/25","Notes":"Note 2"}
]
}"
It gets the data alright. But if I don't convert it to in jquery.dataTables.js >> _fnBuildAjax.baseAjax >> success into the following (between line 9 - 15) it doesn't show data; gets an error can't find lenght of undefined, which I get.
var baseAjax = {
"data": data,
"success": function (json) {
var error = json.error || json.sError;
if ( error ) {
_fnLog( oSettings, 0, error );
}
var x = JSON.parse(json);
oSettings.json = x;
callback(x);
//oSettings.json = json;
//callback( json );
},
"dataType": "json",
"cache": false,
"type": oSettings.sServerMethod,
"error": function (xhr, error, thrown) {
var ret = _fnCallbackFire( oSettings, null, 'xhr', [oSettings, null, oSettings.jqXHR] );
if ( $.inArray( true, ret ) === -1 ) {
if ( error == "parsererror" ) {
_fnLog( oSettings, 0, 'Invalid JSON response', 1 );
}
else if ( xhr.readyState === 4 ) {
_fnLog( oSettings, 0, 'Ajax error', 7 );
}
}
_fnProcessingDisplay( oSettings, false );
}
};
Following are my js code binding with datatables.
var table = $('#example').DataTable({
"processing": true,
"serverSide": false,
"ajax": {
"url": "/Home/GetDateLogData",
"type": "POST"
},
"columns": [
{ "data": "PONumber" },
{ "data": "SupplierNumber" },
{ "data": "SupplierName" },
{ "data": "ProductDescription" },
{ "data": "POQuantity" },
{ "data": "POUOM" },
{ "data": "BatchQuantity" },
{ "data": "BatchUOM" },
{ "data": "ShelfDate" },
{ "data": "ExpireDate" },
{ "data": "CreatedDate" },
{ "data": "CreatedBy" },
{ "data": "POReceiveDate" },
{ "data": "Notes" }
]
});
In the ajax part I've tried with dataSrc as well, didn't work.
"dataSrc": function ( json ) {
var x = JSON.parse(json);
return x;
},
My question, is there any builtin extender to do that, or perhaps how can I make a prototype like thing for this? I thank you in advance.

This is exactly the purpose of dataSrc. It is not working because you are expected to return an array of items, i.e data :
dataSrc: function ( json ) {
json = JSON.parse(json);
return json.data;
},
PS: Why "type": "POST"?

Ext JS Read JSON response before reader in Store

I have JSON response as below -
{
"success": true,
"data": {
"data": [
{
"resultsMap": {
"Title": "Test1",
"Name": "Test1"
},
"id": 1
},
{
"resultsMap": {
"Title": "Test2",
"Name": "Test2"
},
"id": 2
}
],
"total": 2
}
}
I am using a custom reader to extract the data. Problem is I loose the initial JSON response from the server from which I need to extract the "total". Can someone help me in getting the "total" from the json response?
var newStore = Ext.create('Ext.data.BufferedStore', {
pageSize: 2000,
fields:fields,
//leadingBufferZone:50,
//trailingBufferZone:50,
//autoLoad: {start: 0, limit: 2000},
remoteSort: true,
sorters: [{
property : 'name',
direction: 'asc'
}],
proxy: {
type: 'ajax',
url: 'getData.json',
reader: {
type: 'nestedjsonreader',
rootProperty: 'data',
totalProperty: function(data) {
//console.log(data);
return data.totalCount;
},
},
extraParams: {
id:ID
}
},
listeners: {
'load' : function(store, records, success, options){
//the complete response
console.log(store.getProxy().getReader().rawData);
}
}
});
Ext.define('Portal.model.NestedJsonReader', {
extend: 'Ext.data.reader.Json',
alias: 'reader.nestedjsonreader',
readRecords: function(data) {
var arr = data.data.data;
var data = [];
if(arr!=undefined){
for(var i=0;i<arr.length;i++){
var obj = arr[i].resultsMap;
data.push(obj);
}
}
return this.callParent( [ data ]);
}
})

Create a custom property in your store as resp_total and assign data.total to it.

loading data in datatable on onchange event

I want to implement function in which data will be loaded into datatable after onChange event. So for that I am trying to implement code as below.
var viewdatatab = $('#dataTablesFeedback').dataTable({
"columns": [
{ "data": "resourceId" },
{ "data": "feedbackRecommendation" },
{ "data": "technicalSkillGaps" },
{ "data": "technicalAvgSkills" },
{ "data": "feedbackType" },
{ "data": "feedbackId" },
{ "data": "isNew" },
]
});
Which is creating my datatable layout and I am calling below function on dropdown change event is :
function loadFeedback(){
viewdatatabJS = $('#dataTablesFeedback').dataTable({
"processing" : true,
"retrieve" : true,
"ajax" : "/nhp/rest/feedback/viewFeedback",
"fnServerParams": function ( aoData ) {
aoData.push( { "name": "userName", "value":employeeId } ,
{ "name": "resourceId", "value":mentorDataJson[$('#dropDownId').val()].resourceId });
},
});
}
Where I am passing some parameter in aoData.push but my URL is not getting called.

I Solved the issue by simply implementing datatable properties. i wrote my code of datatable
var viewdatatab = $('#dataTablesFeedback').dataTable({
"columns": [
{ "data": "resourceId" },
{ "data": "feedbackRecommendation" },
{ "data": "technicalSkillGaps" },
{ "data": "technicalAvgSkills" },
{ "data": "feedbackType" },
{ "data": "feedbackId" },
{ "data": "isNew" },
]
});
in jsp document.ready(function()) and then on my request call of drop down change event i wrote below code on my javascript function.
$.ajax({
url : "",
type: 'GET',
contentType: "application/json",
data: {
'userName': value,
'resourceId' : value,
},
success: function(data) {
var table = $('#dataTablesFeedback').DataTable();
table.clear();
table.rows.add(data.data);
table.draw();
});
this way i first clear my datatable and then redraw it using my json which i got from my ajax call.
Thanks