Category / Section
How to have the save alone with report designer?
Published:
Updated:
Hide the save button from the designer using the
toolbarSettings
.Use the
toolbarRendering
andtoolbarClick
event to use our custom save button along with save option.
You can refer the following code snippet.
<div id="container"></div>
<script>
$("#container").boldReportDesigner({
toolbarSettings: { items: ej.ReportDesigner.ToolbarItems.All & ~ej.ReportDesigner.ToolbarItems.Save },
toolbarClick: function(args) {
if ($(args.target).hasClass('e-rptdesigner-toolbarcontainer')) {
var saveButton = ej.buildTag('li.e-rptdesigner-toolbarli e-designer-toolbar-align e-tooltxt', '', {}, {});
var saveIcon = ej.buildTag('span.e-rptdesigner-toolbar-icon e-toolbarfonticonbasic e-rptdesigner-toolbar-save e-li-item', '', {}, { title: 'Save' });
args.target.find('ul:first').append(saveButton.append(saveIcon));
}
},
toolbarRendering: function(args) {
if (args.click === 'Save') {
var designer = $('#designer').data('boldReportDesigner');
args.cancel = true;
designer.saveReport();
}
}
});
</script>