Datatables AJAX POST rejected by elastic: Expected [START_OBJECT] but found [VALUE_STRING] - ajax

I am trying to fix a connection to mu local elastic instance but still getting various errors when trying to used server side call.
After various tries I came to situation when getting "Expected [START_OBJECT] but found [VALUE_STRING]".
Trying to find the reason and a solution over internet but no success.
Here is my code.
<script>
$(document).ready(function () {
var query = '{ "query" : { "match_all" : {} } }';
console.log (query);
query = JSON.stringify(query);
console.log (query);
$('#integrations').DataTable( {
"processing": true,
"serverSide": true,
"ajax": {
"url": "http://localhost:9200/integrations-prod/_search?size=1000&source_content_type=application/json",
//WORKS EVEN WITH GET BUT NOT AS SERVERSIDE "url": `http://czchown5029751.prg-dc.dhl.com:9200/integrations-prod/_search?size=1000&source_content_type=application/json&source=${query}`,
//WORKS EVEN WITH GET BUT NOT AS SERVERSIDE "url": `http://czchown5029751.prg-dc.dhl.com:9200/integrations-prod/_search?size=10000`,
data : function ( d ) {
return query;
},
"contentType": "application/json",
//"cache": "false",
"type": "POST",
//"jsonp": "true",
"dataType": "json",
"dataSrc": "hits.hits",
"columnDefs": [ { "defaultContent": "-", "targets": "_all" } ]
},
"columns": [
{ "data": "_source.name" },
{ "data": "_source.description" },
{ "data": "_source.valid" },
{ "data": "_source.status_id" },
{ "data": "_source.region_id" },
{ "data": "_source.validated_time" }
]
} )
});
</script>

Related

DataTables warning: Requested unknown parameter "FileName"... using Json

I have a view which loads the script:
var dataTable;
$(document).ready(function () {
loadDataTable();
});
function loadDataTable() {
dataTable = $('#DT_load').DataTable({
"ajax": {
"url": "/musicfiles/getall/",
"type": "GET",
"datatype": "json"
},
"columns": [
{
"data": "albumartpath",
"render": function (data) {
return `<img src="~/images/" + ${data} ?? "noimage.webp" asp-append-version="true" height="50" width="50" />`;
}, "width": "20%"
},
{ "data": "filename", "width": "20%" },
{ "data": "title", "width": "20%" },
{ "data": "artist", "width": "20%" },
{ "data": "genre", "width": "20" }
],
"language": {
"emptyTable": "no data found"
},
"width": "100%"
});
}
and a MusicFilesController function which returns a Json:
[HttpGet]
public async Task<IActionResult> GetAll()
{
JsonResult json = Json(new { data = await _context.MusicFiles.ToListAsync() });
return json;
}
but when I load the page, I get the error:
DataTables warning: table id=DT_load - Requested unknown parameter 'FileName' for row 0, column 1. For more information about this error, please see http://datatables.net/tn/4
The Json is correctly formatted using strings but I cannot figure out what I am missing. I have looked through about a dozen other posts with similar issues but have not found the answer.
Requested unknown parameter 'FileName' for row 0, column 1.
In your code, we can find that you specify columns.data option with { "data": "filename", "width": "20%" }, if the data source object item(s) with key fileName like below (not filename you specified), which would cause the issue.
{"albumartpath":"https://xxxx/xxx","fileName":"xxx","title":"xxx","artist":"xxx","genre":"xx"}
So please double check the received data on client side and make sure you set the data source for the column correctly.

Can't get merge tags to work - Mandrill/Parse

Here's my Parse Cloud Code call:
Mandrill.sendTemplate({
"template_name": "start-conversation",
"template_content": [{
"name": "example name",
"content": "example content" //Those are required but they are ignored
}],
"message": {
"to": [{
"email": request.params.toUserEmail,
"name": request.params.toUserName
}],
"important": true,
"merge": true,
"global_merge_vars": [
{
"rcpt": request.params.toUserEmail,
"vars": [
{
"name": "TOUSERNAME",
"content": request.params.toUserName
},
{
"name": "FROMUSERNAME",
"content": request.params.fromUserName
},
{
"name": "TOPICNAME",
"content": request.params.topicName
},
{
"name": "LANGUAGE",
"content": request.params.language
}
]
}
],
},
"async": true
},{
success: function(httpResponse) {
console.log(httpResponse);
response.success("mandrillStartConvoRequest -- success -- Email sent!");
},
error: function(httpResponse) {
console.error(httpResponse);
response.error("mandrillStartConvoRequest -- error -- Uh oh, something went wrong");
}
});
Here's the <span> with the tags in my Mandrill Template:
<span style="line-height:20.7999992370605px">
*|TOUSERNAME|*
<br><br>
*|FROMUSERNAME|* would like to start a conversation with you about *|TOPICNAME|* in *|LANGUAGE|* </span>
The e-mail sends fine but no merge =(:
as far as I know the built-in Mandrill.sendTemplate method does not work.
so you should try to call mandrill API yourself, just do a HTTP POST
https://parse.com/questions/send-mandrill-template-email-from-cloud-code-example-code-required
UPDATE:
what I am using in my project is something like this, notice that I am using merge_vars but you are using global_merge_vars
var params = {
key: "xxxxxxxxxxxx",
template_name: "$template_name",
template_content: [],
message: {
to: [
{
email: email
}
],
merge_vars : [{
rcpt: email,
vars:[
{
"name" : "from",
"content" : "Test"
}
]
}]
},
async: true
};
Parse.Cloud.httpRequest({
method: "POST",
headers: {
"Content-Type": "application/json",
},
url: "https://mandrillapp.com/api/1.0/messages/send-template.json",
body: params,
success: function(httpResponse) {
response.success("email sent");
},
error: function(httpResponse) {
console.error(httpResponse);
response.error("Uh oh, something went wrong");
}
});

Attempting to load Ext store with JSON data from AJAX request returns error

Am attempting to load and Ext Store with Ext 4.0.7.
It is returning an Object doesn't support this property or method error when i call the loadRawData method on the store in the success callback of the AJAX request.
Here is the data i am loading:
{
"data": [
{
"id": 1,
"source": "1445261",
"target": "1437043",
"sourceType": "user",
"redirectUrl": "http://www.google.co.uk",
"message": "this is a notification message",
"targetType": "user",
"messageType": "notification",
"sentDate": "1354758001",
"notificationType": "notification",
"parameters": "null",
"read": "false",
"readDate": 1354758001
},
{
"id": 2,
"source": "1445261",
"target": "1437043",
"sourceType": "user",
"redirectUrl": "http://www.google.co.uk",
"message": "this is a notification message",
"targetType": "user",
"messageType": "notification",
"sentDate": "1354758001",
"notificationType": "notification",
"parameters": "null",
"read": "false",
"readDate": 1354758001
},
{
"id": 3,
"source": "1445261",
"target": "1437043",
"sourceType": "user",
"redirectUrl": "http://www.google.co.uk",
"message": "this is a notification message",
"targetType": "user",
"messageType": "notification",
"sentDate": "1354758001",
"notificationType": "notification",
"parameters": "null",
"read": "false",
"readDate": 1354758001
}
]
}
This is the store code and ajax request:
var infoStagingStore = Ext.create('Ext.data.Store', {
model: 'SCB.RMWB.InfoBar.Model.Message',
storeId: 'Staging',
autoLoad: false,
pageSize: 10,
proxy: {
type: 'pagingmemory',
reader: {
type: 'json',
root: 'data'
}
},
listeners: {
load: function(){
console.log('loaded');
}
}
});
Ext.Ajax.request({
url: '/rmwb/resources/js/app/infoBar/data/data.json',
timeout: 60000,
method: 'GET',
scope: this,
params: '',
success: function(resp) {
console.log(resp.responseText);
var store = Ext.data.StoreManager.lookup('Staging');
store.loadRawData(resp.responseText, true);
},
failure: function(resp, opts) {
},
callback: function(options, success, resp) {
}
});
Can't quite see why this is returning an error?
As in my comment, you donĀ“t need a pagingmemory store. What you need is an ajax store because the pagingstore is for allowing pagination with data you have in memory but there is no reason to use it seeing your requirement.
So if you use an standard ajax proxy, you will be able to load it in the normal way (using the .load() method). Then, when you need to add more record from the server you what you have to do is just call the load method again but with the addRecords option.
For example (untested sample):
// load store with historical data
infoStagingStore.load();
// load more records to the store from a different resource
infoStagingStore.load({
url: '/rmwb/resources/js/app/infoBar/data/data.json',
addRecords: true
});
Seeing as you've assigned your store to a variable called infoStagingStore could you not just reference that directory in your ajax call?
Ext.Ajax.request({
url: '/rmwb/resources/js/app/infoBar/data/data.json',
timeout: 60000,
method: 'GET',
scope: this,
params: '',
success: function(resp) {
console.log(resp.responseText);
//var store = Ext.data.StoreManager.lookup('Staging');
infoStagingStore.loadRawData(resp.responseText, true);
},
...

jsTree - loading subnodes via ajax on demand

I'm trying to get a jsTree working with on demand loading of subnodes. My code is this:
jQuery('#introspection_tree').jstree({
"json_data" : {
"ajax" : {
url : "http://localhost/introspection/introspection/product"
}
},
"plugins" : [ "themes", "json_data", "ui" ]
});
The json returned from the call is
[
{
"data": "Kit 1",
"attr": {
"id": "1"
},
"children": [
[
{
"data": "Hardware",
"attr": {
"id": "2"
},
"children": [
]
}
],
[
{
"data": "Software",
"attr": {
"id": "3"
},
"children": [
]
}
]
]
}
.....
]
Each element could have a lot of children, the tree is going to be big. Currently this is loading the whole tree at once, which could take some time. What do I have to do to implement on-demand-loading of child-nodes when they are opened by the user?
Thanks in advance.
Irishka pointed me in the right direction, but does not fully resolve my problem. I fiddled around with her answer and came up with this. Using two different server functions is done only for clarity. The first one lists all products at top level, the second one lists all children of a given productid:
jQuery("#introspection_tree").jstree({
"plugins" : ["themes", "json_data", "ui"],
"json_data" : {
"ajax" : {
"type": 'GET',
"url": function (node) {
var nodeId = "";
var url = ""
if (node == -1)
{
url = "http://localhost/introspection/introspection/product/";
}
else
{
nodeId = node.attr('id');
url = "http://localhost/introspection/introspection/children/" + nodeId;
}
return url;
},
"success": function (new_data) {
return new_data;
}
}
}
});
The json data returned from the functions is like this (notice the state=closed in each node):
[
{
"data": "Kit 1",
"attr": {
"id": "1"
},
"state": "closed"
},
{
"data": "KPCM 049",
"attr": {
"id": "4"
},
"state": "closed"
},
{
"data": "Linux BSP",
"attr": {
"id": "8"
},
"state": "closed"
}
]
No static data is needed, the tree is now fully dynamic on each level.
I guess it would be nice to display by default first level nodes and then the children will be loaded on demand. In that case the only thing you have to modify is to add "state" : "closed" to the nodes whose child nodes are going to be loaded on demand.
You might wish to send node's id in ajax call so you modify your code
"json_data": {
//root elements to be displayed by default on the first load
"data": [
{
"data": 'Kit 1',
"attr": {
"id": 'kit1'
},
"state": "closed"
},
{
"data": 'Another node of level 1',
"attr": {
"id": 'kit1'
},
"state": "closed"
}
],
"ajax": {
url: "http://localhost/introspection/introspection/product",
data: function (n) {
return {
"nodeid": $.trim(n.attr('id'))
}
}
}
}
From jsTree documentation
NOTE:
If both data and ajax are set the initial tree is rendered from the data string. When opening a closed node (that has no loaded children) an AJAX request is made.
you need to set root elements as tree data on page load and then you will be able to retrieve their children with an ajax request
$("#introspection_tree").jstree({
"plugins": ["themes", "json_data", "ui"],
"json_data": {
//root elements
"data": [{"data": 'Kit 1', "attr": {"id": 'kit1'}} /*, ... */], //the 'id' can not start with a number
"ajax": {
"type": 'POST',
"data": {"action": 'getChildren'},
"url": function (node) {
var nodeId = node.attr('id'); //id="kit1"
return 'yuorPathTo/GetChildrenScript/' + nodeId;
},
"success": function (new_data) {
//where new_data = node children
//e.g.: [{'data':'Hardware','attr':{'id':'child2'}}, {'data':'Software','attr':{'id':'child3'}}]
return new_data;
}
}
}
});
See my answer to a similar question here (the old part) for more details
I spended hours on this problem. Finally i got it that way:
$("#resourceTree").jstree({
"types": {
"default": {
"icon": "fa fa-folder-open treeFolderIcon",
}
},
"plugins": ["json_data", "types", "wholerow", "search"],
"core": {
"multiple": false,
"data": {
"url" : function(node){
var url = "rootTree.json";
if(node.id === "specialChildSubTree")
url = "specialChildSubTree.json";
return url;
},
"data" : function(node){
return {"id" : node.id};
}
}
},
});
rootTree.json:
[
{
"text": "Opened root folder",
"state": {
"opened": true
},
"children": [
{
"id" : "specialChildSubTree",
"state": "closed",
"children":true
}
]
}
]
specialChildSubTree.json:
[
"Child 1",
{
"text": "Child 2",
"children": [
"One more"
]
}
]
So i mark the node that become the parent of the ajax loaded subtree with an id, i watch for in the core configuration.
NOTE:
That node must have the "state" : "closed" parameter and it must have
the parameter "children" : true.
I am using jsTree.js in version 3.3.3
Above solution is all fine. Here I am also providing similar working solution and very simple for lazy loading of nodes using ajax call vakata. When your API works like
https://www.jstree.com/fiddle/?lazy
and for getting any child nodes
https://www.jstree.com/fiddle/?lazy&id=2
for explanation and for complete solution you can have a look at https://everyething.com/Example-of-jsTree-with-lazy-loading-and-AJAX-call
<script type="text/javascript">
$(function () {
$('#SimpleJSTree').jstree({
'core' : {
'data' : {
'url' : "https://www.jstree.com/fiddle/?lazy",
'data' : function (node) {
return { 'id' : node.id };
}
}
}
});
});
</script>

AJAX call to REST service doesn't display results in page but a call to the same response in a flat file does

I'm trying to make a call to WCF Data Services and display the results in a GridPanel.
The call works and returns the correct JSON except the GridPanel doesn't display any results.
I tried copying the returned json into a file also on the webserver and replacing the destination url for that. This worked correctly and displays the results.
So as far as I can tell the JSON, the code and the service are all correct but they don't work together properly.
The Ext JS
Ext.define('Customer', {
extend: 'Ext.data.Model',
fields: ['Id', 'CustomerName'],
proxy: {
headers: {
'Accept' : 'application/json'
},
type: 'rest',
url: 'Service.svc/Customers',
reader: {
type: 'json',
root: 'd'
}
}
});
The JSON back from the service
{
"d" : [
{
"__metadata": {
"uri": "http://localhost:52332/testservice.svc/Customers(1)",
"type": "PierbridgeShinePlatformTestModel.Customer"
},
"Id": 1,
"CustomerName": "fred",
"Invoices": {
"__deferred": {
"uri": "http://localhost:52332/testservice.svc/Customers(1)/Invoices"
}
}
},
{
"__metadata": {
"uri": "http://localhost:52332/testservice.svc/Customers(2)",
"type": "PierbridgeShinePlatformTestModel.Customer"
},
"Id": 2,
"CustomerName": "Mr Fred",
"Invoices": {
"__deferred": {
"uri": "http://localhost:52332/testservice.svc/Customers(2)/Invoices"
}
}
}
]
}

Resources