- Result: Lable
@song?, Image
@singer?, Size
@size?
+
+ Result
+
+ Lable: @song?.ToString() | Image: @singer?.ToString() | Size: @size?.ToString()
+
From a list of Option<T>
+
+ From Option<string> items
+
+
+ Selected Value: @stringValue
+ Selected Item
+ Value: @selectedStringOption?.Value (Type: @(selectedStringOption?.GetType()))
+ Text: @selectedStringOption?.Text
+
+
+ From Option<int> items
+
+
+ Selected Value: @intValue
+ Selected Item
+ Value: @selectedIntOption?.Value (Type: @(selectedIntOption?.GetType()))
+ Text: @selectedIntOption?.Text
+
+
+
+
Autocomplete
+
+ Inline Autocomplte
+
+ List Autocomplte
+
+ Both Autocomplte
+
+
+
+
Option template
+
+
+
+
+ @context.FirstName (@context.LastName)
+
+
+
+ Selected option: @selectedEmployee?.FirstName @selectedEmployee?.LastName
+ @if (selectedEmployee != null && selectedEmployee.BirthDate != null)
+ {
+
+ (@selectedEmployee.BirthDate.ToString("yyyy-MM-dd"))
+
+ }
+
+ Selected value: @selectedEmployValue
+ Message: @message;
+
+
+
@code {
string? song;
string? singer;
string? size;
+ Employee selectedEmployee = default!;
+ string? selectedEmployValue;
+ string? message;
+
protected override void OnInitialized()
{
singer = dataService.Singers.FirstOrDefault();
}
+
+ Option
selectedStringOption = default;
+ string? stringValue;
+ Option selectedIntOption = default;
+ string? intValue;
+
+ List> stringOptions = new()
+ {
+ { new Option { Value = "1", Text = "One" } },
+ { new Option { Value = "2", Text = "Two", Selected = true } },
+ { new Option { Value = "3", Text = "Three" } },
+ };
+
+ List> intOptions = new()
+ {
+ { new Option { Value = 3, Text = "1", Disabled = true } },
+ { new Option { Value = 2, Text = "2" } },
+ { new Option { Value = 1, Text = "3" } },
+ };
+
+ List names = new()
+ {
+ "William Hartnell",
+ "Patrick Troughton",
+ "Jon Pertwee",
+ "Tom Baker",
+ "Peter Davidson",
+ "Colin Baker",
+ "Sylvester McCoy",
+ "Paul McGann",
+ "Christopher Eccleston",
+ "David Tenant",
+ "Matt Smith",
+ "Peter Capaldi",
+ "Jodie Whittaker",
+ };
}
diff --git a/BlazorFluentUI/Models/Employee.cs b/BlazorFluentUI/Models/Employee.cs
new file mode 100644
index 0000000..24c13ca
--- /dev/null
+++ b/BlazorFluentUI/Models/Employee.cs
@@ -0,0 +1,27 @@
+namespace BlazorFluentUI.Models
+{
+ public class Employee
+ {
+ public int ID { get; set; }
+ public string Photo { get; set; }
+ public string FirstName { get; set; }
+ public string LastName { get; set; }
+ public string Job { get; set; }
+ public string Title { get; set; }
+ public DateTime BirthDate { get; set; }
+ public DateTime HireDate { get; set; }
+ public string Address { get; set; }
+ public string City { get; set; }
+ public string Region { get; set; }
+ public string PostalCode { get; set; }
+ public string Country { get; set; }
+ public string Phone { get; set; }
+ public string Extension { get; set; }
+ public string Notes { get; set; }
+
+ public override string ToString()
+ {
+ return $"{FirstName} {LastName} ({BirthDate.ToString("yyyy-MM-dd")})";
+ }
+ }
+}
diff --git a/BlazorFluentUI/Program.cs b/BlazorFluentUI/Program.cs
index f6f9f22..9cf749b 100644
--- a/BlazorFluentUI/Program.cs
+++ b/BlazorFluentUI/Program.cs
@@ -17,6 +17,7 @@ builder.Services.AddFluentUIComponents();
builder.Services.AddSingleton();
builder.Services.AddSingleton();
+builder.Services.AddSingleton();
var app = builder.Build();
diff --git a/BlazorFluentUI/Services/EmployeeService.cs b/BlazorFluentUI/Services/EmployeeService.cs
new file mode 100644
index 0000000..ba61b5a
--- /dev/null
+++ b/BlazorFluentUI/Services/EmployeeService.cs
@@ -0,0 +1,63 @@
+using BlazorFluentUI.Models;
+
+namespace BlazorFluentUI.Services
+{
+ public class EmployeeService
+ {
+ private List _fixedSample;
+
+ Random _random = new Random();
+ string[] _firstNames = new[] { "John", "Jane", "Michael", "Emily", "Robert", "Linda", "William", "Jessica", "David", "Sarah" };
+ string[] _lastNames = new[] { "Smith", "Johnson", "Brown", "Williams", "Jones", "Garcia", "Miller", "Davis", "Martinez", "Hernandez" };
+ string[] _jobs = new[] { "Developer", "Designer", "Manager", "Analyst", "Consultant", "Administrator", "Engineer", "Specialist", "Technician", "Coordinator" };
+ string[] _titles = new[] { "Junior", "Mid", "Senior", "Lead", "Chief" };
+ string[] _cities = new[] { "New York", "Los Angeles", "Chicago", "Houston", "Phoenix", "Philadelphia", "San Antonio", "San Diego", "Dallas", "San Jose" };
+ string[] _regions = new[] { "NY", "CA", "IL", "TX", "AZ", "PA", "TX", "CA", "TX", "CA" };
+ string[] _counties = new[] { "USA", "USA", "USA", "USA", "USA", "USA", "USA", "USA", "USA", "USA" };
+
+ public EmployeeService()
+ {
+ _fixedSample = GenerateEmployData(100);
+ }
+
+ public List GetEmployeeData(int count)
+ {
+ return GenerateEmployData(count).ToList();
+ }
+
+ public List GetFixedEmployeeData()
+ {
+ return _fixedSample;
+ }
+
+ private List GenerateEmployData(int count)
+ {
+ var employees = new List();
+ for (int i = 0; i < count; i++)
+ {
+ var employee = new Employee
+ {
+ ID = i + 1,
+ Photo = $"https://randomuser.me/api/portraits/med/{(i % 2 == 0 ? "men" : "women")}/{i}.jpg",
+ FirstName = _firstNames[_random.Next(_firstNames.Length)],
+ LastName = _lastNames[_random.Next(_lastNames.Length)],
+ Job = _jobs[_random.Next(_jobs.Length)],
+ Title = _titles[_random.Next(_titles.Length)],
+ BirthDate = new DateTime(_random.Next(1950, 2000), _random.Next(1, 13), _random.Next(1, 29)),
+ HireDate = DateTime.Today.AddDays(-_random.Next(1, 3650)),
+ Address = $"{_random.Next(1, 9999)} Main St",
+ City = _cities[_random.Next(_cities.Length)],
+ Region = _regions[_random.Next(_regions.Length)],
+ PostalCode = $"{_random.Next(10000, 99999)}",
+ Country = _counties[_random.Next(_counties.Length)],
+ Phone = $"{_random.Next(100, 999)}-555-{_random.Next(1000, 9999)}",
+ Extension = $"{_random.Next(100, 9999)}",
+ Notes = "Generated demo data"
+ };
+ employees.Add(employee);
+ }
+
+ return employees;
+ }
+ }
+}
diff --git a/BlazorFluentUI/Services/TestDataService.cs b/BlazorFluentUI/Services/TestDataService.cs
index be1d57d..31b5ce4 100644
--- a/BlazorFluentUI/Services/TestDataService.cs
+++ b/BlazorFluentUI/Services/TestDataService.cs
@@ -22,6 +22,8 @@
"Good Vibrations", "Smells Like Teen Spirit", "What's Going On", "Hotel California", "One"
};
+ songs = songs.OrderBy(s => Guid.NewGuid()).ToList();
+
var hitSongs = new List();
for (int i = 0; i < 5; i++)
{
@@ -40,6 +42,8 @@
"Led Zeppelin", "Pink Floyd", "Queen", "The Rolling Stones", "U2"
};
+ singers = singers.OrderBy(s => Guid.NewGuid()).ToList();
+
var randomSingers = new List();
for (int i = 0; i < 5; i++)
{