Kendo UI Grid Excel export issues - kendo-ui

I'm trying to use the (relatively new) built-in Excel and PDF export features in Kendo UI grid, which seem pretty straightforward. The PDF downloads with all of the data, but the Excel file just has the column headers with no data.
Just trying for the most basic implementation of this at the moment; in the grid init block I have:
$("#accountsContactsGrid").kendoGrid({
toolbar: ["excel", "pdf"],
excel: {
fileName: "DonorsGridExport.xlsx",
filterable: true
},
pdf: {
fileName: "DonorsGridExport.pdf"
},
dataSource: { <snip rest of datasource code...> }
});
The grid shows fine in the browser as well as the PDF. It's just the Excel that is the exception, with no data showing.
I also tried pulling the buttons outside of the toolbar and using the saveAsExcel and saveAsPDF functions, and I get the same result (PDF works, Excel has no data).
Any ideas why the data would go missing just for the Excel export?

Related

Pass Pasted Clipboard Image From CKeditor to Dropzone

We currently have code that handles all our image uploads via Dropzone.js. This includes functionality to paste from the clipboard and upload via dropzone.js, which currently works. This is that event code:
document.onpaste = function(event)
{
alert('pasted');
var items = (event.clipboardData || event.originalEvent.clipboardData).items;
for (index in items) {
var item = items[index];
if (item.kind === 'file') {
// adds the file to your dropzone instance
myDropzone.addFile(item.getAsFile());
}
}
}
Following this, we have added a CKEditor (v4.10) html text editor to that page. The CKEditor has its own clipboard handling built in. If you activate the CKEditor (for example by clicking the text area), the CKEditor effectively takes control of the clipboard from that point. Which is correct, because we want the editor to be able to copy and paste text still.
However, CKEditor does not natively have image uploading built into it. It requires a plugin. But we would prefer not to use this plugin, and rather intercept the paste event, and if the data pasted is an image, pass that along to our dropzone.js handler instead.
While I am able to intercept that event, I am not sure what event data (if any) I can extract from the CKEditor paste event to pass along to the Dropzone handler. Here is the code so far:
var editor = CKEDITOR.instances.NoteText;
editor.on( 'paste', function( event )
{
alert('pasted ck');
console.dir(event);
//myDropzone.addFile(item.getAsFile());
} );
I have tried inspecting the event to see if anything is available for me to use, but don't seem to find anything.
Is what I'm trying to accomplish possible? Is it possible for me to somehow find and pass along the pasted event data from CKEditor to DropZone? Or am I going to have to implement the CKEditor image upload plugin?
Thanks.

SpagoBI Chart rendering engine in custom webapp

I'm struggling to have a chart correctly rendered in an html page.
In SpagoBI webapp, I log in as "biuser", then go to "document" menu, then take the 1st chart that is already here ("Char Grouped Bar"). In the Spago webapp, I can see the chart, as it is rendered through ExtJS.
Then I want to display this chart in an html page, to put in my own webapp. I acheive this with the Spago Javascript SDK, via the injectDocument method.
My code is:
Sbi.sdk.api.injectDocument({
documentLabel: 'Char Grouped Bar'
, executionRole: '/spagobi/user'
, parameters: {warehouse_id: 19}
, displayToolbar: false
, displaySliders: false
, target: 'targetDiv'
, height: '500px'
, width: '800px'
, iframe: {
style: 'border: 0px;'
}
});
This does not work, as the SDK wants to render the chart via the HighCharts library, and I do not have this library (and do not want to).
=> I can see no documentation about this, so, how can I render the chart via ExtJS, as in the SpagoBI admin webapp?
Thanks!

CKEditor 4: Replacing code when in editor view

My software allows people to upload images to a "Files" section on my site. I want to allow users to insert those images into a CKEditor 4 instance but I want to control where those images are hosted.
Instead of inserting the following:
<img src="http://domain.com/image.jpg" />
I want it to insert:
<img src="[file:12345678]" />
I can then use PHP to control what URL will be displayed on the website.
The issue is, in the WYSIWYG view of CKEditor, it shows as the image could not be found. Is there anyway I can create a plugin that replaces the [file:12345678] with the image code when in WYSIWYG view but in source view it reverts back to [file:12345678]?
Kind of like how the BBCode plugin works. When you go to source view you see:
The [b]brown fox[/b] jumped over the log
But the editor view you see:
The brown fox jumped over the log
I tried to work out the code from the BBCode plugin but the BBCode parsers seems to be something built-in.
I found the following code but it only applies to the source view. I can't seem to find out if there is a similar function of the WYSIWYG view.
editor.dataProcessor.htmlFilter.addRules(
{
elements :
{
img : function( element )
{
// I can get the src of any image and then replace it.
element.attributes.src
}
}
});
Thanks for any advice you can give ;)
There are two type of filters in htmlDataProcessor (which is the default data processor) - htmlFilter which is used to filter HTML format, so the format used "inside" editor while editing; and dataFilter which is used to filter data format, so the format used "outside" editor - the one you see in source mode or when you call editor.getData(). Those names can be confusing, but it helps when you remember that "data" is outside (because editor.getData()).
So I guess that when loading data to editor (transforming data to HTML) you want to replace [file:\d+] URLs with addresses from some hash and when getting data back (transforming HTML to data) you want to make the opposite transformation.
Therefore you need to extend both filters - htmlFilter and dataFilter. This is how the dataFilter may look:
editor.dataProcessor.dataFilter.addRules( {
elements: {
img: function( el ) {
el.attributes.src = fileIdToUrlHash[ el.attributes.src ];
}
}
} );
Similar operation you have to do in the htmlFilter.

pdf generation from dwr json data

I call a method using dwr, where i l load a grid. That grid data must be generated in the form of a pdf.
LogsDataHandler.fetchEmailList(id1, id2, date1, date2,function(data){
}
the return data must be generated as a pdf. Any help ?
You should try to export jqgrid to excel built: http://www.trirand.net/documentation/php/_32h0wojvn.htm
stackoverflow answer:
JQGrid: Export Grid to PDF
examples:
http://www.trirand.com/blog/phpjqgrid/examples/export/pdf/default.php
http://www.trirand.com/blog/?page_id=393/help/export-to-excel-and-pdf/

Dojo Xhr: Result Content is Not Appearing until there is a mouse click anywhere on page

i'm building an offline application with Dojo 1.7, using Dojo RDD, generating forms dynamically and storing them in cache.
now every time when i fetch something through ajax i have to remove dojo registry because dojo binds widgets by id if i dont clear registry it will cause problem in parsing dojo widgets because their ids already exist in widget registry, but when i clear registry every time it causes another problem. everything works fine but the result content only appear when clicking anywhere on page. same as described in:
Dynamic Elements are not appearing in IE8 until there is a mouse click
but, in this case this problem is with Chrome.
and the solution provided in above url doesn't work in this case.
exp:
//in some cases registry is destructor is not called.
dojo.xhrGet({
url: serverUrl,
content: {},
load: function(result) {
//destroying widget registry.(before any parsing)
dijit.registry._destroyAll();
// here is html processing.
},
error: function(error) {
utility.handleException(error);
}
});

Resources