Skip to content

Commit 5ab2fdc

Browse files
Merge pull request SyncfusionExamples#14 from Backiaraj/UG
Prepared UG samples for Blazor InputMask, Kanban, LinearGauge and ListBox components
2 parents a4ee248 + 0835a1d commit 5ab2fdc

File tree

328 files changed

+12561
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

328 files changed

+12561
-0
lines changed

InputMask/Client/App.razor

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<Router AppAssembly="@typeof(App).Assembly">
2+
<Found Context="routeData">
3+
<RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
4+
<FocusOnNavigate RouteData="@routeData" Selector="h1" />
5+
</Found>
6+
<NotFound>
7+
<PageTitle>Not found</PageTitle>
8+
<LayoutView Layout="@typeof(MainLayout)">
9+
<p role="alert">Sorry, there's nothing at this address.</p>
10+
</LayoutView>
11+
</NotFound>
12+
</Router>
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
2+
3+
<PropertyGroup>
4+
<TargetFramework>net6.0</TargetFramework>
5+
<Nullable>enable</Nullable>
6+
<ImplicitUsings>enable</ImplicitUsings>
7+
</PropertyGroup>
8+
9+
<ItemGroup>
10+
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="6.0.8" />
11+
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="6.0.8" PrivateAssets="all" />
12+
<PackageReference Include="Syncfusion.Blazor.DropDowns" Version="20.3.0.57" />
13+
<PackageReference Include="Syncfusion.Blazor.Inputs" Version="20.3.0.57" />
14+
<PackageReference Include="Syncfusion.Blazor.Themes" Version="20.3.0.57" />
15+
</ItemGroup>
16+
17+
<ItemGroup>
18+
<ProjectReference Include="..\Shared\InputMaskUGSample.Shared.csproj" />
19+
</ItemGroup>
20+
21+
</Project>
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
@page "/counter"
2+
3+
<PageTitle>Counter</PageTitle>
4+
5+
<h1>Counter</h1>
6+
7+
<p role="status">Current count: @currentCount</p>
8+
9+
<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
10+
11+
@code {
12+
private int currentCount = 0;
13+
14+
private void IncrementCount()
15+
{
16+
currentCount++;
17+
}
18+
}
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<table>
2+
<tr>
3+
<td><a href="DataBindings/DataBinding">Data Binding</a></td>
4+
<td><a href="DataBindings/ValueBinding">Value Binding</a></td>
5+
</tr>
6+
</table>
7+
8+
9+
<style>
10+
a {
11+
padding-right: 75px;
12+
}
13+
</style>
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
@page "/DataBindings/DataBinding"
2+
<BindingRoute></BindingRoute>
3+
4+
<p>MaskedTextBox value is: @MaskValue</p>
5+
6+
<SfMaskedTextBox @bind-Value="@MaskValue"></SfMaskedTextBox>
7+
8+
@code {
9+
public string MaskValue { get; set; } = "12345";
10+
}
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
@page "/DataBindings/ValueBinding"
2+
<BindingRoute></BindingRoute>
3+
4+
<SfMaskedTextBox Mask="00000" @bind-Value="@MaskValue"></SfMaskedTextBox>
5+
6+
<button @onclick="@UpdateValue">Update Value</button>
7+
8+
@code {
9+
10+
public string MaskValue { get; set; } = "12345";
11+
12+
public void UpdateValue()
13+
{
14+
MaskValue = "67890";
15+
}
16+
}
Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
@page "/fetchdata"
2+
@using InputMaskUGSample.Shared
3+
@inject HttpClient Http
4+
5+
<PageTitle>Weather forecast</PageTitle>
6+
7+
<h1>Weather forecast</h1>
8+
9+
<p>This component demonstrates fetching data from the server.</p>
10+
11+
@if (forecasts == null)
12+
{
13+
<p><em>Loading...</em></p>
14+
}
15+
else
16+
{
17+
<table class="table">
18+
<thead>
19+
<tr>
20+
<th>Date</th>
21+
<th>Temp. (C)</th>
22+
<th>Temp. (F)</th>
23+
<th>Summary</th>
24+
</tr>
25+
</thead>
26+
<tbody>
27+
@foreach (var forecast in forecasts)
28+
{
29+
<tr>
30+
<td>@forecast.Date.ToShortDateString()</td>
31+
<td>@forecast.TemperatureC</td>
32+
<td>@forecast.TemperatureF</td>
33+
<td>@forecast.Summary</td>
34+
</tr>
35+
}
36+
</tbody>
37+
</table>
38+
}
39+
40+
@code {
41+
private WeatherForecast[]? forecasts;
42+
43+
protected override async Task OnInitializedAsync()
44+
{
45+
forecasts = await Http.GetFromJsonAsync<WeatherForecast[]>("WeatherForecast");
46+
}
47+
}
Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
@page "/CustomUIAppearance"
2+
<HowToRoute></HowToRoute>
3+
4+
<SfMaskedTextBox Mask="00000" Value="34523" CssClass="e-style" Placeholder="Enter user ID" FloatLabelType="@FloatLabelType.Always"> </SfMaskedTextBox>
5+
6+
<style>
7+
.e-mask.e-style .e-control.e-maskedtextbox {
8+
color: #00ffff;
9+
letter-spacing: 10px;
10+
font-size: xx-large;
11+
border: 1px;
12+
border-color: #ffffff;
13+
}
14+
15+
.e-control-wrapper.e-mask.e-float-input.e-style .e-float-line::before {
16+
background: #ffffff;
17+
}
18+
19+
.e-control-wrapper.e-mask.e-float-input.e-style .e-float-line::after {
20+
background: #ffffff;
21+
}
22+
23+
.e-control-wrapper.e-mask.e-float-input.e-style .e-float-text.e-label-top {
24+
color: #00ffff;
25+
font-size: medium;
26+
}
27+
</style>
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<table>
2+
<tr>
3+
<td><a href="CustomUIAppearance">CustomUIAppearance</a></td>
4+
<td><a href="ModelBinding">Model Binding</a></td>
5+
</tr>
6+
</table>
7+
8+
9+
<style>
10+
a {
11+
padding-right: 75px;
12+
}
13+
</style>
Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
@page "/ModelBinding"
2+
<HowToRoute></HowToRoute>
3+
4+
@using System.ComponentModel.DataAnnotations
5+
6+
<EditForm Model="@User">
7+
<DataAnnotationsValidator />
8+
<div asp-validation-summary="All" class="text-danger"></div>
9+
<div class="form-group">
10+
<SfMaskedTextBox Mask="00000" Placeholder='Provide user ID' @bind-Value="@User.ID"></SfMaskedTextBox>
11+
<ValidationMessage For="@(() => User.ID)" />
12+
</div>
13+
<button type="submit" class="btn btn-primary">Submit</button>
14+
</EditForm>
15+
16+
@code {
17+
18+
public Customer User = new Customer();
19+
20+
public class Customer
21+
{
22+
[Required(ErrorMessage = "User ID is required")]
23+
24+
public string ID { get; set; }
25+
26+
}
27+
}

0 commit comments

Comments
 (0)