How to Get the data from servlet to EXTJS - extjs3

I am using EXTJS and SERVLET, in servlet I am passing the value through request.setAttribute,
But not able get the value in EXTJS.
Ext.onReady(function(){
var myData=null;
Ext.Ajax.request({
url: 'DisplayTest',
method:'POST',
success: function ( result, request ) {
myData =Ext.decode(result.responseText);
},
failure: function ( result, request) {
Ext.MessageBox.alert('Failed', result.responseText);
}
});
var store = new Ext.data.ArrayStore({
fields: [
{name: 'name'},
{name: 'id'},
]
});
store.loadData(myData);
// create the Grid
var grid = new Ext.grid.GridPanel({
store: store,
columns: [
{
// id :'company',
header : 'Name',
width : 160
},
{
header : 'ID',
width : 75
},
],
height: 350
});
grid.render('db-grid');
});
In above code I want to get the value from servlet into variable myData in the form of array or List.
can anyone give me some example through servlet and EXTJS.
Thanks

You will not be able to pass the data directly from Servlet using request.setAttribute. Use the formPanel.getForm().load() method to pass the request to the servlet. This method requires a JSON object in the response: something of the form:
{ success: true, {
name: "Andy",
dob: "11-12-1987"
}
}
You can either send this data through the PrintWriter.write() function or use the JSON API in the servlet which directly gives the json string based on the data provided to the API.

Related

Meteor prefill a collection

I have made the following collection in meteor:
CodesData = new Mongo.Collection('CodesData');
CodesDataSchema = new SimpleSchema({
code: {
label: "Code",
type: Number
},
desc: {
label: "Description",
type: String,
}
});
CodesData.attachSchema(CodesDataSchema);
Now I want to prefill this collection with some data.
For example: code: 1 desc: "hello".
How can I do this manually and easily?
You can use Meteor.startup to run some actions on your collection once the server app has been loaded and is starting:
CodesData = new Mongo.Collection('CodesData');
CodesDataSchema = new SimpleSchema({ code: { label: "Code", type: Number }, desc: { label: "Description", type: String, } });
.attachSchema(CodesDataSchema);
Meteor.startup(()=>{
// Only fill if empty, otherwise
// It would fill on each startup
if (CodesData.find().count() === 0) {
CodesData.insert({ code: 1, description: 'some description' });
}
});
If you have a lot of data to prefill you can define it in a JSON and load it on startup:
Consider the following json named as pre:
{
codesdata: [
{ code: 1, description: 'foo' },
{ code: 7, description: 'bar' }
]
}
Meteor.startup(()=>{
const preData = JSON.parse( pre );
preData.codesData.forEach( entry => {
CodesData.insert( entry );
});
});
This allows you to manage your prefill more easily and also let's you version control the json if desired ( and no sensitive data is revealed ).
Considerations:
The function Meteor.startup runs on each start. So you should consider how to avoid unnecessary inserts / prefill that create doubles. A good way is to check if the collection is empty (see first example).
You may put the startup code an another js file in order to separate definitions from startup routines.
The current script does not differentiate between server or client. You should consider to do this on server and create a publication / subscription around it.
More readings:
https://docs.meteor.com/api/core.html#Meteor-startup
Importing a JSON file in Meteor
https://docs.meteor.com/api/core.html#Meteor-settings

jstree with ajax search and massload plugin

I'm trying to get the massload plugin to work with my jstree configuration. The nodes are built as Country->City->Site->Product->License. When the tree is loaded initially, only the top level nodes are loaded (in my case Countries). When a user expands a node, the children are loaded using ajax. I have a search box that searches in the tree, this works, but it only matches on nodes that are already loaded. I would like to this to work on all site level nodes, loaded or not.
The search ajax call to returns a list of site ids, which is passed to the massload plugin. It calls the LazyLoad method with the correct ids. What I'm can't figure out is what to return in response to the massload call. According to this, it should take the form of
{
"id1" : { "id" : node_id_of_child1, "text" : "child2", "id" : node_id_of_child2, "text" : "child2" },
"id2" : { ... node data ...}
}
Where id1 and id2 are matching node id's from the search.
But when I do that, the nodes aren't added to the tree and the search term only matches on nodes already loaded.
This is my jstree configuration
$('#tree').jstree({
core: {
data: {
url: '#Url.Action("Nodes", "Home")',
data: function (node) {
if (node.id === '#')
return {
nodeType: 'root'
};
else
return {
nodeType: node.data.type,
nodeValue: node.data.value
};
},
type: 'POST'
}
},
plugins: ["massload", "search"],
search: {
"show_only_matches": true,
ajax: {
url: '#Url.Action("Search", "Sites")',
type: 'POST'
}
},
massload: {
url: '#Url.Action("LazyLoader", "Home")',
data: function (nodes) {
return { "ids": nodes.join(",") };
},
type: 'POST'
},
themes: {
"theme": "default",
"dots": false,
icons: true
}
});
Questions:
- Is the response format from the massload ajax call correct?
- What is the massload plugin's action based on this response? Should it try to load the nodes in the response in the same way (i.e. using the same ajax call) the nodes are loaded when a user requests them?

How to give configurable URL in tableau WDC

I am trying to build a tabeau WDC.
this is my code
(function () {
var myConnector = tableau.makeConnector();
myConnector.getSchema = function (schemaCallback) {
var cols = [{
id: "month",
dataType: tableau.dataTypeEnum.string
}, {
id: "value1",
alias: "value1",
dataType: tableau.dataTypeEnum.float
}, {
id: "value2",
alias: "value2",
dataType: tableau.dataTypeEnum.float
}];
var tableSchema = {
id: "testfeed",
alias: "test Feed",
columns: cols
};
schemaCallback([tableSchema]);
};
myConnector.getData = function (table, doneCallback) {
$.getJSON('http://test.com/view?name=test&filters=[{"type":"number","id_equals":["123"]}]', function (resp) {
var feat = resp.DATA,
tableData = [];
// Iterate over the JSON object
for (var i = 0, len = feat.length; i < len; i++) {
tableData.push({
"MONTH": feat[I].month,
"ChargeEntryLag_NUMERATOR": feat[i]. value1,
"ChargeEntryLag_DENOMINATOR": feat[i]. value2
});
}
table.appendRows(tableData);
doneCallback();
});
};
tableau.registerConnector(myConnector);
$(document).ready(function () {
$("#submitButton").click(function () {
tableau.connectionName = "testFeed";
tableau.submit();
});
});
})();
my URL contains some filters as shown in the above code, so if U want to get data for a particular filter I have to hardcode it in URL and the use it.
In other word my URL is static , Is there a way to make it dynamic.
suppose I want the value of 'id' to be 10in my filter, for that I have to go the the WDC code and change it. can it be made configurable.
use tableau.connectionData to pass data. There is an example in this tutorial:
https://tableau.github.io/webdataconnector/docs/wdc_multi_table_tutorial
Typically you'd create a form. When you connect with the WDC in tableau desktop, you put in the URL of your form. The form will store the form vars in tableau.connectData. Your getData can then take those and create a custom Data Source inside tableau desktop for you.
- Mike

How to iterate on form array member in c# server (client is Extjs form)

In the server I get my arrays as such string:
0:val1,1:val2,2:val3
I work with NameValueCollection but this iterates through all the form members.
How do I parse\iterate through array form member to get a neat array of
{"val1","val2","val3"} without its index?
BTW - the client was sent with ExtJs Form submit...(maybe its something in the client?)
I don't know how useful such an array could be if you can't map the value to its property, but try this:
var values[];
Ext.each(form.getForm().items, function (field) {
values.push(field.getValue());
}, this);
Ext.Ajax.request({
url: 'backend.php',
method: 'POST',
params: {
values: Ext.JSON.encode(values)
},
success: function(response){
// process server response here
}
});

How can I access a date typed field from an ExtJS JSonStore?

I've been trying to retrieve a date value and an integer value from the database, using the following code:
var l_alsChampsMois, l_stoDonneesMois;
try {
l_alsChampsMois = [
{name: "date_mois", type: "date", dateFormat: "Y-m-d"},
{name: "indice", type: "integer"}
];
l_stoDonneesMois = new Ext.data.JsonStore({
fields: l_alsChampsMois,
autoLoad: false,
proxy: {
type: "ajax",
url: "/commun/req_sql/req_ind_per_mois.php",
reader: {
type: "json",
root: "rows"
},
// some configs to use jsFiddle echo service (you will remove them)
actionMethods: {
read: "POST"
},
extraParams: {
key:"test"
}
},
listeners: {
load: function(objStore, alsLignes, blnOk, objOptions) {
window.alert("Mois fin : " + objStore.getAt(0).get("date_mois"));
}
}
});
l_stoDonneesMois.load({params: {
p_idsoc: l_strIdSociete,
p_mois: l_datDebut.getMonth() + 1,
// getMonth renvoie 0 pour janvier, etc.
p_annee: l_datDebut.getFullYear(),
p_debut: 1,
p_etape: 1
}
});
with l_strIdSociete and l_datDebut being variables previously assigned and /commun/req_sql/req_ind_per_mois.php the PHP page that retrieves the data and converts it to JSON.
It seems to work fine (indeed, Firebug tells me the load does retrieve a data structure with "date_mois" and "indice" containing the values I expect them to), only the window.alert returns undefined. If I replace "date_mois" with "indice", it returns the expected value for "indice".
I've tried to use objStore.getAt(0).getData()["date_mois"], to no avail.
My only clue about this is that "date_mois" in the data structure shown by Firebug is an Object, but even so it shouldn't be undefined, now should it? I looked up http://docs.sencha.com/ext-js/4-1/#!/api/Ext.data.Field-cfg-type that wasn't exactly forthcoming with straight answers.
So what did I do wrong there?
If you need current time you can use php time function(note: it returns seconds, JS uses milliseconds), in another case you need to convert by mktime function.