Can you use kendo ui with HTML5 viewer
I am working on a custom module and I have it working with data-binding and simple html elements like <li> and <div> tags. However, I would really like to use a kendo datagrid (or someting like it) to add some additional functionality for viewing and sorting the results. I thought I had it - but I couldn't get the data-binding to work. So two questions:
1. Is this possible?
2. Is there a set of built in advanced ui tools that I could take advantage of?
Thanks,
Bryan
-
OK, I got this to work - I was missing the reference to the kendo.js files in the index.html.
However, I still wonder if this is a good idea to add additional javascript libraries to the mix. Any thoughts/experience on how this might impact performance?
0 -
fwiw, I'm doing the same with a Backgrid, and works well so far (in development). The amount of additional js is pretty minimal when considering the additional functionality/control over your results
0 -
Hi,
We are also struggling to achieve the same functionality , please can you share some pointers on how to proceed. since you guys are succesful please guide others.
0 -
Here is how we handled it. I would send you a link to the site but it is still running on the test environment.
References for the Kendo Grid have been added to the index.html file (not sure this is the best solution but it seems to be working for now).
/customer/servlet/servlet.FileDownload?file=00P6000000eltt4EAA
Using the Kendo Grid in the module:
/customer/servlet/servlet.FileDownload?file=00P6000000eltv5EAA
Hope that helps.
Bryan
0 -
vsoni,
if interested about backgrid, I did mine through code and built the grid based on essentials attributes. Assuming you have a featureset object from a search, identify featurecollection: I wrapped all the features around a Backbone.Collection, which then gets sent into the grid. So the backbone collection contained all attributes, but the feature itself (handy for getting the esri feature, etc for grid events like zooming)
So like this (typescript):
dojo.forEach(featureSet.features.get(), function (feature: geocortex.essentialsHtmlViewer.mapping.infrastructure.Feature) {
var bbfeature = new BackboneEssentialsFeature({ feature: feature });
dojo.forEach(feature.attributes.get(), function (attribute: geocortex.essentialsHtmlViewer.mapping.infrastructure.FeatureAttribute) {
if (attribute.visible.get()) {
bbfeature.attributes[attribute.name.get()] = attribute;
}
}, this);
features.push(bbfeature);
}, this);creating the columns:
dojo.forEach(featureSet.attributes.get(), function (attribute: geocortex.essentialsHtmlViewer.mapping.infrastructure.FeatureAttribute) {
if (attribute.visible.get()) {
this.columnHeaders.push(new Backgrid.Column({ id: attribute.name.get(), name: attribute.name.get(), label: attribute.displayName.get(), editable: false }));
}
}
}, this);Then after creating the columns I can create a grid in my view class.
this.grid = new Backgrid.Grid({
className: "permitting-grid",
columns: this.viewModel.columnHeaders,
collection: featureCollection
});
then append to my view html$(this["permittingResultsGrid"]).append(this.grid.render().$el);
I chose backgrid because it was free and pretty extensible. There is more going on in the background, but that is the gist.
Hope that helps
0 -
Thank you very much. Sorry for my late reply. I will check and get back on this,. Also if possible in future please share the link also.
Thanks again.
0
Bitte melden Sie sich an, um einen Kommentar zu hinterlassen.
Kommentare
6 Kommentare