GitXplorerGitXplorer
V

Jazor

public
0 stars
0 forks
2 issues

Commits

List of commits on branch main.
Verified
ccc77dfcf4050f34328b04d3f1bdd73aa8371516

Update README.md

VVaclavElias committed 3 years ago
Verified
ebaba7ec116d90ddc13c1c1f01b83185db59f2cf

Update README.md

VVaclavElias committed 4 years ago
Verified
934d173fd273bd67107f4b8c8fb87c4f306393eb

Update README.md

VVaclavElias committed 4 years ago
Verified
7335d0bd3176c061d3e972d460a4017d64c6f22c

Update README.md

VVaclavElias committed 4 years ago
Verified
73111dd02d35c1c5d46df89272da416a600297b2

Update README.md

VVaclavElias committed 4 years ago
Verified
b01d263cdbe0cc1676f171a9e2e546eb5242c8df

Update README.md

VVaclavElias committed 4 years ago

README

The README file for this repository.

Jazor Experiment

This experiment library helps with very common actions on the website which involve repeating JavaScript code across multiple different projects. Click a button or a link, do something in the backend and UI. This library takes an approach rather updating whole HTML blocks than granular tags with JSON and JavaScript libraries, so there is no need fiddling and mapping JSON objects to whatever UI you have.

You might find this approach useful in certain project cases if you want to write minimum or no JavaScript. Still, JavaScript knowledge is required in certain scenarios.

There is a crossover with Blazor or rather Jazor is filling a gap between static HTML/Razor pages and Blazor.

When could you possibly use this library and not necessarily Blazor?

  • You have got many Partial views in Razor pages and views which you would like to reuse e.g.
public IActionResult OnGetNews() =>  Partial("_NewsPartial", 10);
  • You would like a hybrid of your current website and add simple SPA functionality
  • Your project doesn't require minimising traffic in between the browser and server

This library is using currently:  

  • TypeScript to handle all common actions workload
  • ASP.NET Core 5.0 TagHelpers to simplify using data- and a bit help with strongly typed Controllers and Actions

Requirements

  1. Add jazor.js to your Razor page or _Layout.
  2. Add @addTagHelper *, Jazor to your _ViewImports.cshtml

ToDo

  • Add more functionality
  • Make prompts and spinners pluggable

Examples

I will be heavily using Bootstrap in my examples.

Example 1

Load multiple delayed HTML / Partial Views.

  • Load News part
  • Load Top News part after 1 second
  • This will load your HTML from your desired url
    <div jazor-url="/examples/news">Loading...</div>
    <div jazor-url="@((nameof(ExamplesController), nameof(ExamplesController.TopNews), null))" jazor-delay="1">Loading...</div>

Example 2

Click a button or link to load HTML / Partial Views to your target element.

    <button jazor-click="/examples/itnews" jazor-target="content" type="button" class="btn btn-primary">Show .NET News</div>
    <button jazor-click="@((nameof(ExamplesController), nameof(ExamplesController.AngularNews), null))" jazor-target="content" type="button" class="btn btn-primary">Show Angular News</button>

    <div id="content">The content will be loaded here.</div>