Ext.Net.Classic Example not working

  1. #1

    Ext.Net.Classic Example not working

    Hello,

    i am trying to run a simple example of ext.net.classic but i have the following error:

    JavaScript critical error at line 1882, column 21 in http://localhost:5000/extnet/extnet/...n\nSCRIPT1028: Expected identifier, string or number

    I have visual studio 2019 Pro and and Ext.net.Classic 7.0.0

    I am doing someτhing wrong ?

    Startup Code
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Threading.Tasks;
    using System.IO.Compression;
    using Microsoft.AspNetCore.ResponseCompression;
    using Microsoft.AspNetCore.Builder;
    using Microsoft.AspNetCore.Hosting;
    using Microsoft.Extensions.Configuration;
    using Microsoft.Extensions.DependencyInjection;
    using Microsoft.Extensions.Hosting;
    using Ext.Net;
    using Ext.Net.Core;
    using Westwind.AspNetCore.LiveReload;
    
    namespace WebApplication1
    {
      public class Startup
      {
        public Startup(IConfiguration configuration)
        {
          Configuration = configuration;
        }
    
        public IConfiguration Configuration { get; }
    
        // This method gets called by the runtime. Use this method to add services to the container.
        public void ConfigureServices(IServiceCollection services)
        {
          services.Configure<GzipCompressionProviderOptions>(options =>
          {
            options.Level = System.IO.Compression.CompressionLevel.Optimal;
          });
    
          services.AddResponseCompression(options =>
          {
            options.EnableForHttps = false;
            options.Providers.Add<GzipCompressionProvider>();
    
            options.MimeTypes = new[]
                  {
                        "text/css",
                        "application/javascript",
                        "application/json",
                        "text/json",
                        "application/xml",
                        "text/xml",
                        "text/plain",
                        "image/svg+xml",
                        "application/x-font-ttf"
              };
          });
    
    #if DEBUG
          services.AddRazorPages().AddRazorRuntimeCompilation();
    
          // See https://github.com/RickStrahl/Westwind.AspnetCore.LiveReload
          services.AddLiveReload();
    #endif
    
          // 1. Register Ext.NET services
          services.AddExtNet();
          services.AddExtCharts();
        }
    
        // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
        public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
        {
          if (env.IsDevelopment())
          {
            app.UseDeveloperExceptionPage();
            app.UseLiveReload();
          }
          else
          {
            app.UseExceptionHandler("/Error");
          }
    
          app.UseResponseCompression();
    
          // 2. Use Ext.NET resources
          //    To be added prior to app.UseStaticFiles()
          app.UseExtNetResources(config =>
          {
    #if DEBUG
            config.UseDebug(true);
    #endif
            config.UseEmbedded();
            config.UseCharts();
            config.UseThemeSpotless();
          });
    
          // 3. Enable Ext.NET localization [not required]
          //    If included, localization will be handled automatically
          //    based on client browser preferences
          app.UseExtNetLocalization();
          app.UseStaticFiles();
          app.UseRouting();
          app.UseAuthorization();
    
          // 4. Ext.NET middleware
          //    To be added prior to app.UseEndpoints()
          app.UseExtNet(config =>
          {
            config.Theme = ThemeKind.Spotless;
          });
    
          app.UseEndpoints(endpoints => endpoints.MapRazorPages());
        }
      }
    }
    index.cshtml.cs


    using Microsoft.AspNetCore.Mvc;
    using Microsoft.AspNetCore.Mvc.RazorPages;
    
    using Ext.Net;
    using Ext.Net.Core;
    
    namespace Company.WebApplication1.Pages
    {
      [DirectModel]
      public class IndexModel : PageModel
      {
        public void OnGet()
        {
    
        }
    
        [Direct]
        public IActionResult OnPostButtonClick()
        {
          this.X().Toast("Button Clicked 👍");
    
          return this.Direct();
        }
      }
    }
    index.cshtml

    @page  "{handler?}"
    @model Company.WebApplication1.Pages.IndexModel
    @{
        Layout = null;
    }
    
    <!DOCTYPE html>
    
    <html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Ext.NET web application</title>
    </head>
    <body style="padding: 30px;">
        <ext-panel
            title="Sample Panel"
            iconCls="x-md md-icon-check-circle-outline"
            width="480"
            height="360"
            layout="Fit"
            bodyPadding="18"
            collapsible="true"
            html="Click button to call server-side [Direct] handler">
            <buttons>
                <ext-button
                    text="Click Me"
                    scale="Medium"
                    iconCls="x-md md-icon-chat-bubble-outline">
                    <directevents>
                        <click pageHandler="ButtonClick" method="POST" />
                    </directevents>
                </ext-button>
            </buttons>
        </ext-panel>
    </body>
    </html>
    Attached Thumbnails Click image for larger version. 

Name:	error.jpg 
Views:	156 
Size:	97.9 KB 
ID:	25451  
  2. #2
    Thanks for posting this question and providing a detailed reproducible sample.

    We are investigating and we should be able to provide another update very shortly.
    Geoffrey McGill
    Founder
  3. #3
    We have reproduced the js error and it looks like this might be an issue in IE only. Viewing the page in Edge, Chrome/Chromium, Opera, Firefox, Safari, etc. should should work fine.

    We are investigating a fix, although will likely have to make a patch release.

    Something else I noticed, can you make the following change to in your Startup.cs to remove the fencing #if DEBUG directive:

    Existing
    #if DEBUG
          services.AddRazorPages().AddRazorRuntimeCompilation();
    
    
          // See https://github.com/RickStrahl/Westwind.AspnetCore.LiveReload
          services.AddLiveReload();
    #endif
    Revised
          services.AddRazorPages().AddRazorRuntimeCompilation();
    
    
          // See https://github.com/RickStrahl/Westwind.AspnetCore.LiveReload
          services.AddLiveReload();
    Did you install the Ext.NET vsix extension for Visual Studio? Then created a new project from the Ext.NET project template?
    Do you have the latest vsix installed? Looks like there might be an update available.

    I will post another update once we have a fix in place for the CSRF js error issue. It's an easy fix but we just need to work out scheduling a public patch release.
    Geoffrey McGill
    Founder
  4. #4
    Thanks for answer.

    I have install vsix to visual studio but the strange thing is that it has 2 templates for ext.net with different names than the forum docs.

    So i created the project by hand with the info from forum.

    One other thing to keep in mind is that when i run the project executable from the debug dir that is f:\WorkArea\Tests\ext.net7.example\WebApplication1 \bin\Debug\netcoreapp3.1 the example works fine because dos console shows content root path this dir.

    but when i run from visual studio the dos console window says content root path is
    f:\WorkArea\Tests\ext.net7.example\WebApplication1 and then the error appears
    Attached Thumbnails Click image for larger version. 

Name:	error2.jpg 
Views:	149 
Size:	53.4 KB 
ID:	25452  
  5. #5
    I tested on Chrome, Firefox and Opera. Works ok. In microsoft edge does not.

    vsix template is the lastest from forum link.

    I try the suggestion to remove DEBUG directives but same error
    Last edited by mtsig; Oct 15, 2020 at 2:49 PM.
  6. #6
    Thanks for the additional feedback. We are working our way through fixing this issue and will update the old blog posts and docs with the most recent install details. I'll review the vsix template names as well.

    Likely need the latest Microsoft Edge browser. The one that runs on Chromium. We will still get this working on older IE browsers though.
    Geoffrey McGill
    Founder
  7. #7
    Microsoft Edge is latest chromium. Version 86.0.622.38.

    Thanks I 'll be waiting

Similar Threads

  1. Ext.NET 7.0 Classic for ASP.NET Core Now Available
    By geoffrey.mcgill in forum 7.x Classic Premium Help
    Replies: 0
    Last Post: Oct 08, 2020, 4:37 PM
  2. Ext.NET 7.0 Classic for ASP.NET Core Now Available
    By geoffrey.mcgill in forum Open Discussions
    Replies: 0
    Last Post: Oct 08, 2020, 4:36 PM
  3. Icons summary Ext.Net 7.0 Classic
    By lu7jm in forum 7.x Classic Help
    Replies: 1
    Last Post: Jun 20, 2020, 1:53 AM
  4. Replies: 8
    Last Post: Jul 03, 2014, 8:03 AM
  5. Replies: 2
    Last Post: May 23, 2011, 10:45 AM

Posting Permissions