We Keep Coding

Setting data into a Kendo DataSource Without Ajax

I have some client-side JSON and want to use to "quickly" experiment with various controls without writing all the REST API calls. All I want to do is point any given Kendo DataSource to the local array of data I already have instead of writing all the extra's...but nothing I do works.
I have tried various online examples...can someone direct me to something that actually works?
EXAMPLE:
This particular example is for their Donut Chart using Angular, but I cant use their data calls because of CORS & I am getting tired of writing a new set of REST calls every time I merely want to experiment with a particular control.
var data = [{ ... }, { ... }]
$scope.screenResolution = new kendo.data.DataSource({
// I dont want this at the moment
//transport: {
// read: {
// url: "http://demos.telerik.com/kendo-ui/content/dataviz/js/screen_resolution.json",
// dataType: "json"
// }
//},
sort: {
field: "order",
dir: "asc"
},
group: {
field: "year"
}
});

Datasource has a data property that you can set to a local array.
http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-data

Extjs 4, How to send multiple metaData for multiple dynamic grids, using a single Json file

I need to create 8-10 grids on a single panel, using accordion Layout. All grids would be created dynamically using the metaData object in JSON and metachange listener event on my store and reconfigure my grid accordingly (Pretty standard process) . But is there a way to use a single JSON file containing metaData and Data of more than one grid. So that I can use multiple stores to read a single JSON.
Something Like this would be good:
"grid1" :
{
"metaData" : {---"root":"data1"-----------}
},
"grid2" :
{
"metaData" : {----"root":"data2"----------}
},
"data1" : {------------------},
"data2" : {-----------------}
I already tried using metaProperty tag in my store, but that approach doesn't seem to work for me(ExtJs 4.1.3) .
Store Proxy:
proxy: {
type: 'ajax',
url: 'MultiData.json',
reader: {
type: 'json'
// metaProperty : 'grid1', //Doesn't work, hence commented
}
Store Listener:
'metachange' :function (store, meta) {
Grid.reconfigure(store, meta.columns);
}
NOTE: The above code works perfectly when I have only one metaData and data tag in JSON

How about this :
Get all the data you need using a single Ext.Ajax Call
Split the data into parts as you need.
use store.loadData() to load directly to store. This should also trigger the metachange listener and configure the grid accordingly. If it doesn't you can use the configure() property of the grid : grid.reconfigure(store,columns)
http://docs.sencha.com/extjs/4.1.3/#!/api/Ext.data.Store-method-loadData
http://docs.sencha.com/extjs/4.1.3/#!/api/Ext.grid.Panel-method-reconfigure

Display JSON Data using Alloy UI

I'm simply tring to parse json data and have it display in a datatable using Alloy UI's framework
YUI().use(
'aui-datatable', 'json-parse',
function(Y) {
var columns = [
{ key: 'ID', sortable: true },
{ key: 'Name', sortable: true }
];
var jsonstring = '{"info":['+
'{"ID":"100", "Name":"Roy"},'+
'{"ID":"200", "Name":"Moss"},'+
'{"ID":"300", "Name":"Jen"}'+
']}';
try {
data = Y.JSON.parse(jsonstring);
}
catch (e) {
alert("Invalid data");
}
new Y.DataTable(
{
columns: columns,
data: data
}
).render("#mySearchResultsContainer");
}
1) How would I map ID and Name to the columns in my datatable?
2) How might this be accomplished using data from an external json file?

Here you go: http://jsfiddle.net/9wd8jqtL/
The main problem was that the data you pass into DataTable needs to be an array: you were passing the object. Passing in data.info provides it with the array you want:
new Y.DataTable(
{
columns: columns,
data: data.info
}
).render("#mySearchResultsContainer");
Also, you need to include the Alloy UI data table script one way or another, I think. I certainly did on the jsfiddle to get it working (also I think there may be issues with newer versions of YUI on jsfiddle too), but that shouldn't be an issue elsewhere.
On getting external data, it depends where it's coming from. But most likely you'll need Y.io or similar to load the data, and have your table building function in the callback for when the data returns.

Make jqgrid fill column with data derived from the one passed as 'data'

I am making a jqgrid using datatype local - a json array returned from the server.
jQuery("#my_table").jqGrid(
{ datatype: "local",
colNames: ['ID', 'Name','Status', 'Date'],
colModel:[ {name:'id',index:'id', width:50, sorttype:"int"},
{name:'name',index:'name', sorttype:"string"},
{name:'status',index:'status', width:50, sorttype:"string"},
{name:'date',index:'date', width:120, align:"left",sorttype:"date"} ],
data: result,
...});
However, one of the columns - status - is represented as numbers.
I would like to display this data as the respective strings. For example 'Active' for status = 1 and 'Inactive' for status = 0.
Is it possible to do this directly in jqgrid, for example as additional colModel parameter or jqgrid method?
I have read through the documentation of jqgrid and failed to notice way of addressing this problem.
I don't want to change the data returned from the server, as I don't see any point in passing redundant information.
I would also prefer if I don't have to manipulate the result array in javascript directly as I don't see point in traversing the array 2 times (once to change the status and the second for jqgrid loading).

You can use formatter: "select":
{name:'status',index:'status', width:50,
formatter:'select', editoptions: {value:'0:Inactive;1:Active'}}

Somewhere in js code:
var status_lines = ['Inactive', 'Active'];
function status_formatter(cellvalue, options, rowObject) {
return status_lines[cellvalue];
}
Then in colModel:
{name:'status',index:'status', width:50, sorttype:"string", formatter:status_formatter}
And of course, you can just do this in formatter:function(c,o,r){...} style if you prefer that.

How to retrieve Ext.data.JsonStore data in sencha

I have the following code -
var options = new Ext.data.JsonStore({
model: 'options_model',
data: [
{ id: 1, option1: 'Alope', status1: 'true',option2: 'Option2', status2: 'false',option3: 'Option3', status: 'false',option4: 'Option4', status4: 'false' }
]
});
Now how can I retrieve data of option ???

I suggest you put your data into maybe a filename.json file (this is to maintain the scalability and integrity of your code).
Anyway, wherever it is you store your data, this is the code you need:
Ext.Ajax.request({
url: 'path_to_ur_json_file_wrt_html_file/filename.json', //in my case it was data/xyz.json since my folder layout was : abc.html, app, data, lib, stylesheets; and my data.json was in the data folder :)
timeout:3000, //how long it shud try to retrieve data in ms
method:'GET',
success: function(xhr) {
jsonData = Ext.util.JSON.decode(xhr.responseText);
var data4u = jsonData.data[0].option1;
}
});

First, JsonStore is not really a class to use. It's internal to Sencha and may be removed at any time. You should use Ext.data.Store instead.
Second, many of the out-of-the-box components in Sencha receive a store as confguration options so you don't have to worry about the inner workings.
Finally, if you do need to access store's data, you can do so by using each, getAt or find methods, depending on your needs and the way you want to access your data (random access, sequential or search).
I suggest you to go over this documentation:Sencha 1.1 Documentation