Using Js Viewer with WebDesigner in AR18

Using Js Viewer with WebDesigner in AR18

Posted by: michael.zhong on 23 February 2025, 1:42 pm EST

• 

  michael.zhong

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 23 February 2025, 1:42 pm EST

  We used AR15 now, when try migrate to AR18, it always show error “ReferenceError: GrapeCity is not defined” on “var designerOptions = GrapeCity.ActiveReports.WebDesigner.createDesignerOptions();”.
  
  We can not find some way to fix it, can you help us? Thanks.

  [code]
  
  
  
  

  <div id="designer-id" style="width: 100%; height: 100%;"></div>
  
  <script>
  
          var designerOptions = GrapeCity.ActiveReports.WebDesigner.createDesignerOptions();
          designerOptions.server.url = 'api';
          designerOptions.reportInfo = '@reportId' ? { id: '@reportId' } : null;
  
          designerOptions.openButton.visible = false;
          designerOptions.fileView.visible = false;
          designerOptions.saveButton.visible = true;
          designerOptions.saveAsButton.visible = false;
  
          designerOptions.reportItemsFeatures.table.autoFillFooter = true;
  
          var viewer = null;
          designerOptions.openViewer = function (options) {
              if (viewer) {
                  viewer.openReport(options.reportInfo.id);
                  return;
              }
              viewer = GrapeCity.ActiveReports.JSViewer.create({
                  locale: options.locale,
                  element: '#' + options.element,
                  localeUri: './custom-zh.json',
                  reportService: {
                      url: 'api/reporting',
                  },
                  reportID: options.reportInfo.id,
                  settings: {
                      zoomType: 'FitPage'
                  },
                  panelsLocation: 'sidebar',
                  parametersPanel: { location: 'top' }
              });
          };
  
          designerOptions.dataTab.dataSets.canModify = true;
          designerOptions.dataTab.dataSources.canModify = true;
          designerOptions.dataTab.dataSources.options.oleDbProviders = ['Microsoft.Jet.OLEDB.4.0', 'SQLOLEDB.1', 'MSDataShape.1', 'MSDASQL.1', 'MSDAORA.1'];
  
          GrapeCity.ActiveReports.WebDesigner.renderApplication("designer-id", designerOptions);
  
  </script>
  

  [/code]
• 

  katyayny.raghuvanshi

  

  • Post Options:
  • Link
    Copy

  Posted 23 February 2025, 11:35 pm EST

  Hi Michael,

  We would suggest that you go through the steps of creating a WebDesigner application using ActiveReports 18 using our official documentation here: https://developer.mescius.com/activereportsnet/docs/latest/online/web-designer-application.html

  You may also refer to the WebDesigner sample here: https://developer.mescius.com/activereportsnet/docs/latest/online/web-designer-mvc-(core).html

  We hope this helps!

• 

  michael.zhong

  • Post Options:
  • Link
    Copy

  Posted 3 March 2025, 4:37 am EST

  Done, thanks.