Hola, tengo estoy experimentado con Syncfusion Blazor y tengo este problema con SfComboBox.
creo que es un problema de configuración, al pulsar en el comboBox no aparecen los ítems.
Por favor ¿podrían ayudarme?
ventanas 11
.NET 6
Ejemplo
(_Layout.cshtml)
<! DOCTYPE html>
<html lang="es">
<cabeza>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<base rel='nofollow' href="~/" />
<link rel="stylesheet" rel='nofollow' href="css/bootstrap/bootstrap.min.css" />
<link rel='nofollow' href="css/site.css" rel="stylesheet" />
<link rel='nofollow' href="UtilSOS.styles.css" rel="stylesheet" />
<link rel='nofollow' href="_content/Syncfusion.Blazor/styles/bootstrap4.css" rel="stylesheet" />
<script src="_content/Syncfusion.Blazor.Core/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>
<component type="typeof(HeadOutlet)" render-mode="ServerPrerendered" />
</cabeza>
(_Imports.razor)
@using Syncfusion.Blazor
@using Syncfusion.Blazor.Calendars
@using Syncfusion.Blazor.Buttons
@using Syncfusion.Blazor.DropDowns
@using Syncfusion.Blazor.Data
(Programa.cs)
constructor. Services.AddSyncfusionBlazor( options => { options. IgnoreScriptIsolation = true; });
constructor. Servicios.AddSyncfusionBlazor();
(mipagina.razor)
@page "/mipagina"
@using Syncfusion.Blazor
@using Syncfusion.Blazor.DropDowns
<div class="col-lg-12 control-section">
<div class="control-wrapper">
<div class="cascading">
<SfComboBox TValue="string" TItem="Games"PopupHeight="350px" PopupWidth="350px" Placeholder="Select a game" DataSource="@LocalData">
<ComboBoxFieldSettings Value="ID" Text="Text"></ComboBoxFieldSettings>
</SfComboBox>
</div>
</div>
</div>
<estilo>
.control-wrapper {
ancho máximo: 250px;
margen: 0 auto;
relleno: 10px 0px 0px;
}
.example-label {
tamaño de fuente: 14px;
margin-bottom: 6px;
}
.control-wrapper .cascading {
padding: 30px 0px 0px;
}
</style>
@code {
public class Games
{
public string? ID { get; set; }
public string? Text { get; set; }
}
List<Games> LocalData = new List<Games> {
new Games() { ID= "Game1", Text= "American Football" },
new Games() { ID= "Game2", Text= "Badminton" },
new Games() { ID= "Game3", Text= "Basketball" },
new Games() { ID= "Game4", Text= "Cricket" },
new Games() { ID= "Game5", Text= "Football" },
new Games() { ID= "Game6", Text= "Golf" },
new Games() { ID= "Game7", Text= "Hockey" },
new Games() { ID= "Game8", Text= "Rugby"},
new Games() { ID= "Game9", Text= "Snooker" },
new Games() { ID= "Game10", Text= "Tennis"},
};
}
Hi Jose Cruz,
Thanks for contacting Syncfusion support.
Based on the shared information, we suspect that you have use Syncfusoin.Blazor.Dropdowns NuGet package and included incorrect theme reference.
Please change the following theme in your end.
Add the Syncfusion theme file reference in the <head> of the ~/Pages/_Layout.cshtml file.
|
<link rel='nofollow' href="_content/Syncfusion.Blazor.Themes/bootstrap5.css" rel="stylesheet" /> |
Also we suggest you to use Syncfusion.Blazor.Dropdowns and Syncfusion.Blazor.Themes NuGet packages instead of Syncfusion.Blazor .
https://blazor.syncfusion.com/documentation/combobox/getting-started#add-style-sheet
Since 2022 Vol1 (20.1) version, Syncfusion.Blazor.Themes is removed from dependencies of Syncfusion.Blazor.Core, hence refer Syncfusion.Blazor.Themes NuGet explicitly from this release.
https://blazor.syncfusion.com/documentation/release-notes/20.1.47?type=all#breaking-changes
Also we have attached working sample for your reference.
Regards
Mohanraj M
replied via Email | |
Perdón y muchas gracias, le conteste agradecido a Mohanraj Mathaiyan que me lo resolvió, Gracias |
Hi Jose,
You are welcome. Please get back to us if you need any further assistance.
Regards,
Ranjani