J'essaie de générer des cases à repasser dynamiques imbriquées dans .net à l'aide de C #.
Je veux afficher des départements et des zones avec une case à cocher à côté de chacun. Lorsque la case à cocher est vérifiée pour un département, elle devrait ensuite afficher les zones de ce département juste en dessous de celle-ci, en retrait, avec des cases à cocher à côté d'eux.
Je suis capable de générer les téléphones avec des cases à cocher de manière dynamique, mais Je ne suis pas sûr de savoir comment faire les zones. Une partie de la question est que je n'ai pas d'identifiants individuels pour chaque département, c'est juste une liste. Le résultat devrait être que lorsque vous cliquez sur la case à cocher à côté de un Département, les domaines de ce département sont présentés en dessous de ce département, en retrait, avec une case à cocher à côté de chacun.
3 Réponses :
Eh bien écrit tout le code est vraiment difficile sans le faire dans Visual Studio. Alors, ici, je vous aiderai à commencer au moins. Si je comprends bien que chaque déperecteur ait une liste de surface, vous devez créer une classe qui le dit. comme ceci, par exemple.
public class Area()
public int AreaId {get; set; }
public string AreaDetails { get; set; }
}
public class Departments (){
public int DepartmentId { get; set; }
public string DepartmentDetails { get; set; }
public List<Area> Areas { get; set; } // all area that are included in the current depertment
}
Un exemple super simpliste est ce qui suit:
<div class="TABLE">
<div class="ROW">
<div class="CELL CELL50">
<asp:CheckBoxList ID="cblDepts" runat="server" OnSelectedIndexChanged="cblDepts_SelectedIndexChanged" AutoPostBack="True"></asp:CheckBoxList>
</div>
<div class="CELL CELL50">
<asp:CheckBoxList ID="cblAreas" runat="server" Visible="false">
</asp:CheckBoxList>
</div>
</div>
</div>
public partial class _Default : Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
this.cblDepts.Items.Add(new ListItem() { Text = "1", Value = "1" });
this.cblDepts.Items.Add(new ListItem() { Text = "2", Value = "2" });
this.cblDepts.Items.Add(new ListItem() { Text = "3", Value = "3" });
}
}
protected void cblDepts_SelectedIndexChanged(object sender, EventArgs e)
{
this.cblAreas.Items.Clear();
foreach (ListItem item in this.cblDepts.Items) {
var selectedValue = "-1";
if (item.Selected)
{
selectedValue = item.Value;
}
if (selectedValue == "1")
{
this.cblAreas.Items.Add(new ListItem() { Text = "1.1", Value = "1.1" });
}
else if (selectedValue == "2")
{
this.cblAreas.Items.Add(new ListItem() { Text = "2.2", Value = "2.2" });
}
else if (selectedValue == "3")
{
this.cblAreas.Items.Add(new ListItem() { Text = "3.3", Value = "3.3" });
}
}
if (this.cblAreas.Items == null || this.cblAreas.Items.Count == 0)
{
this.cblAreas.Visible = false;
}
else
{
this.cblAreas.Visible = true;
}
}
}
Ceci est utile et me fait partie de la route. J'ai besoin que les valeurs apparaissent en dessous du département. Ainsi, par exemple, vous pourriez avoir des départements comptables alors HR - alors HR a des éléments ci-dessous, en retrait - puis de retour dans la liste des départements serait des opérations, etc. Je pense que la solution est principalement HTML et une liaison de données .NET.
Ici en Grèce, il est 00h00 minuit, je peux revenir demain matin et aider 😜👊🏼
Si vous utilisez JavaScript n'est pas un problème pour vous, vous pouvez effectuer ce qui suit:
<asp:Repeater ID="DepartmentsRepeater" runat="server">
<ItemTemplate>
<input class="departments" onclick="show(this)" type="checkbox" value="<%# Container.DataItem?.ToString() %>" /><%# Container.DataItem?.ToString() %> </br>
<asp:Repeater ID="AreasRepeater" runat="server" DataSource='<%# GetAreasOfDepartment(Container.DataItem?.ToString()) %>'>
<ItemTemplate>
<div class="areas <%#((RepeaterItem)Container.Parent.Parent).DataItem?.ToString() %>">
<input type="checkbox" value="<%# Container.DataItem?.ToString() %>" /><%# Container.DataItem?.ToString() %> </br>
</div>
</ItemTemplate>
</asp:Repeater>
</ItemTemplate>
</asp:Repeater>
<script>
$(".areas").hide();
function show(e) {
$(".areas").hide();
$(".departments").each(function (d) {
if (this.checked) {
var c = "." + this.value;
$(c).show();
}
})
}
</script>
public partial class _Default : Page
{
public List<string> Departments = new List<string> { "HR", "Finance" };
public Dictionary<string, List<string>> Areas = new Dictionary<string, List<string>>
{
{"HR", new List<string>{"HR1","HR2"} },
{"Finance", new List<string>{ "Finance1", "Finance2" } }
};
protected void Page_Load(object sender, EventArgs e)
{
this.DepartmentsRepeater.DataSource = Departments;
this.DepartmentsRepeater.DataBind();
}
public List<string> GetAreasOfDepartment(string dep)
{
return Areas[dep];
}
}
Merci pour votre aide, Ricky. J'ai essayé ce code mais il semble y avoir un problème avec le HTML et JavaScript / JQuery. Pour l'erreur, il est indiqué: "Terme d'expression non valide CS1525". '' et cela n'aime pas cette ligne: