Coder Social home page Coder Social logo

texnomic / jsonviewer Goto Github PK

View Code? Open in Web Editor NEW
15.0 15.0 6.0 252 KB

ASP.NET Core JsonViewer Component for Server-Side Blazor Based-on Alenaksu's Json-Viewer https://github.com/alenaksu/json-viewer.

License: MIT License

HTML 33.77% C# 32.53% CSS 33.70%
blazor json web-component

jsonviewer's People

Contributors

dependabot-preview[bot] avatar texnomic avatar

Stargazers

avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar

Watchers

avatar avatar avatar

Forkers

koliyo jrbueno davidatwhiletrue solecode naiduv zdomokos

jsonviewer's Issues

Unhandled exception rendering component: $ is not a function

I was trying to use this library. I have the .js referenced in my index.html,

Using it like so:

<JsonViewer @ref="JsonViewerInstance"></JsonViewer>

@code
{
	protected JsonViewer JsonViewerInstance { get; set; }

	protected override async Task OnAfterRenderAsync(bool firstRender)
	{
		await JsonViewerInstance.Render(JsonConvert.SerializeObject(@User.Value));
		await base.OnAfterRenderAsync(firstRender);
	}

}

I'm getting the following error:

blazor.webassembly.js:1 crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
      Unhandled exception rendering component: $ is not a function
      TypeError: $ is not a function
          at Object.JsonViewer (https://localhost:10001/_content/Texnomic.Blazor.JsonViewer/scripts/JsonViewer.js:9:13)
          at https://localhost:10001/_framework/blazor.webassembly.js:1:3332
          at new Promise (<anonymous>)
          at Object.beginInvokeJSFromDotNet (https://localhost:10001/_framework/blazor.webassembly.js:1:3306)
          at Object.St [as invokeJSFromDotNet] (https://localhost:10001/_framework/blazor.webassembly.js:1:59849)
          at _mono_wasm_invoke_js_blazor (https://localhost:10001/_framework/dotnet.6.0.2.jez5zq7uy0.js:1:194973)
          at wasm://wasm/00970812:wasm-function[219]:0x1a129
          at wasm://wasm/00970812:wasm-function[167]:0xcaf7
          at wasm://wasm/00970812:wasm-function[166]:0xba0a
          at wasm://wasm/00970812:wasm-function[2810]:0xabacf
Microsoft.JSInterop.JSException: $ is not a function
TypeError: $ is not a function
    at Object.JsonViewer (https://localhost:10001/_content/Texnomic.Blazor.JsonViewer/scripts/JsonViewer.js:9:13)
    at https://localhost:10001/_framework/blazor.webassembly.js:1:3332
    at new Promise (<anonymous>)
    at Object.beginInvokeJSFromDotNet (https://localhost:10001/_framework/blazor.webassembly.js:1:3306)
    at Object.St [as invokeJSFromDotNet] (https://localhost:10001/_framework/blazor.webassembly.js:1:59849)
    at _mono_wasm_invoke_js_blazor (https://localhost:10001/_framework/dotnet.6.0.2.jez5zq7uy0.js:1:194973)
    at wasm://wasm/00970812:wasm-function[219]:0x1a129
    at wasm://wasm/00970812:wasm-function[167]:0xcaf7
    at wasm://wasm/00970812:wasm-function[166]:0xba0a
    at wasm://wasm/00970812:wasm-function[2810]:0xabacf
   at Microsoft.JSInterop.JSRuntime.<InvokeAsync>d__16`1[[Microsoft.JSInterop.Infrastructure.IJSVoidResult, Microsoft.JSInterop, Version=6.0.0.0, Culture=neutral, PublicKeyToken=adb9793829ddae60]].MoveNext()
   at Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync(IJSRuntime jsRuntime, String identifier, Object[] args)
   at Texnomic.Blazor.JsonViewer.JsonViewerBase.Render(String Json)
   at redacted.Main.DebugPage.OnAfterRenderAsync(Boolean firstRender) in c:\redacted\Main\DebugPage.razor:line 32
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)

Not sure if I'm using it right or if I have add anything else

Getting Error with a very simple page

I just have this simple page:

@using Texnomic.Blazor.JsonViewer
<JsonViewer @ref="JsonViewerInstance"></JsonViewer>
@code { 
    public string jsonString { get; set; } = "{\"RebateType\": [ \"Commission\", \"Downpayment\", \"Tax Rebate\" ]}";
    protected JsonViewer JsonViewerInstance { get; set; 
    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        await JsonViewerInstance.Render(jsonString);
        await base.OnAfterRenderAsync(firstRender);
    }
}

I followed all the instructions and added JQuery as well.
but I get this error in loading:

crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
      Unhandled exception rendering component: $ is not a function
      TypeError: $ is not a function
          at Object.JsonViewer (https://localhost:7131/_content/Texnomic.Blazor.JsonViewer/scripts/JsonViewer.js:9:13)
          at https://localhost:7131/_framework/blazor.webassembly.js:1:3337
          at new Promise (<anonymous>)
          at Object.beginInvokeJSFromDotNet (https://localhost:7131/_framework/blazor.webassembly.js:1:3311)
          at Object.Gt [as invokeJSFromDotNet] (https://localhost:7131/_framework/blazor.webassembly.js:1:62569)
          at Object.Ii (https://localhost:7131/_framework/dotnet..zr9go7vxvc.js:5:71974)
          at _mono_wasm_invoke_js_blazor (https://localhost:7131/_framework/dotnet..zr9go7vxvc.js:6077:71)
          at do_icall (wasm://wasm/0334fa86:wasm-function[3646]:0xc6f3b)
          at do_icall_wrapper (wasm://wasm/0334fa86:wasm-function[3593]:0xc5e37)
          at interp_exec_method (wasm://wasm/0334fa86:wasm-function[3522]:0xb6a22)
Microsoft.JSInterop.JSException: $ is not a function

Update Nuget package - 0.2.0

Hi, It seems the code has been updated via PR to 0.2.0, but the nuget package is still at 0.1.0. Any chance of getting them in sync? Thanks.

Implicit dependency on jQuery

This component does not work without jQuery

ReferenceError: $ is not defined

And this is resolved by explicitly loading the jQuery CDN.

But even better would be if this component did not depend on jQuery.

Example how to use

Is it possible to add example blazor app to show how to use your component?

I tried to do steps from readme file but this part does not allow me to compile the code:

Create Backing Element Reference In Example.razor.cs File:

using Texnomic.Blazor.JsonViewer;

protected JsonViewer JsonViewerInstance { get; set; }

protected async ValueTask Example(string Json)
{
await JsonViewerInstance.Render(Json);
}

I get error saying Example method can not exist in the class with the same name

Missing methods

Hi, is it possible to use other methods like Expand, Collapse etc from Blazor Server ?
I only see the Render method on my JsonViewer instance

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.