Comment puis-je effacer la sélection précédente lorsqu'un asp: TreeView se trouve dans un UpdatePanel?

Question

J'ai une page ASP.Net 2.0 qui contient deux UpdatePanels. Le premier panneau contient un TreeView. Le deuxième panneau contient une étiquette et est déclenché par une sélection dans l'arborescence. Lorsque je sélectionne un nœud, l'étiquette est mise à jour comme prévu et le TreeNode sur lequel j'ai cliqué est mis en surbrillance et le nœud précédemment sélectionné n'est plus en surbrillance. Toutefois, si un nœud est mis en évidence dans l’original (sélectionné) dans le code-behind, la surbrillance n’est pas supprimée lors de la sélection d’un autre nœud.

Le balisage

<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
   <ContentTemplate>
      <asp:TreeView ID="TreeView1" runat="server" OnSelectedNodeChanged="TreeView1_SelectedNodeChanged">
         <SelectedNodeStyle BackColor="Pink" />
      </asp:TreeView>
   </ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="True">
   <ContentTemplate>
      <asp:Label ID="Label1" runat="server" Text=" - "></asp:Label>
   </ContentTemplate>
   <Triggers>
      <asp:AsyncPostBackTrigger ControlID="TreeView1" EventName="SelectedNodeChanged" />
   </Triggers>
</asp:UpdatePanel>

Le code derrière

protected void Page_Load(object sender, EventArgs e)
{
   if (!IsPostBack)
   {
      TreeView1.Nodes.Add(new TreeNode("Test 1", "Test One"));
      TreeView1.Nodes.Add(new TreeNode("Test 2", "Test Two"));
      TreeView1.Nodes.Add(new TreeNode("Test 3", "Test Three"));
      TreeView1.Nodes.Add(new TreeNode("Test 4", "Test Four"));
      TreeView1.Nodes[0].Selected = true;
   }
}

protected void TreeView1_SelectedNodeChanged(object sender, EventArgs e)
{
   Label1.Text = TreeView1.SelectedValue;
}

Au début, le premier nœud est sélectionné. Pourquoi sa surbrillance n'est-elle pas supprimée lors de la sélection d'un autre noeud?

De plus, j'ai posé une autre question. à propos de la même configuration que je n'ai pas eu de réponse. Toute aide serait appréciée.

Modifier Je sais que la définition de ChildrenAsTriggers = "false" fonctionnera, mais je souhaite éviter de restituer l'arborescence car elle peut être très volumineuse.

Answer 1

Cela peut être un peu un bidouillage, mais cela effacera la sélection sur le client et évitera de mettre à jour le panneau.

Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(function BeginRequestHandler(sender, args)
   {
      var elem = args.get_postBackElement();
      var selectedClassName = elem.id + '_1';

      var arrAllElements = GetElementsByClassName(selectedClassName, elem);
      var selectedNode = $get(elem.id + '_SelectedNode').value;

      for(var i = 0; i < arrAllElements.length; i++)
      {
         if(arrAllElements[i].childNodes[0].id != selectedNode)
            RemoveClassName(arrAllElements[i], selectedClassName );
      }
   }
);

Il supprime le style / la classe sélectionné (e) de tous les nœuds de l'arborescence, sauf si sa valeur est contenue dans le champ masqué '_SelectedNode'. GetElementsByClassName et RemoveClassName sont dans ma propre bibliothèque js mais sont assez évidents.

Answer 2

    /// <summary>
    /// Remove selection from TreeView
    /// </summary>
    /// <param name="tree"></param>
    public static void ClearTreeView(TreeView tree)
    {

        if (tree.SelectedNode != null)
        {
            tree.SelectedNode.Selected = false;
        }
    }

Answer 3

Vous devez définir la sélection sur false pour tous les nœuds.

J'utilise quelque chose comme ceci pour l'une de mes applications (avec mon treeview tvCategories):

public void RefreshSelection(string guid)
{
    if (guid == string.Empty)
        ClearNodes(tvCategories.Nodes);
    else
        SelectNode(guid, tvCategories.Nodes);

}

private void ClearNodes(TreeNodeCollection tnc)
{
    foreach (TreeNode n in tnc)
    {
        n.Selected = false;
        ClearNodes(n.ChildNodes);
    }
}
private bool SelectNode(string guid, TreeNodeCollection tnc)
{
    foreach (TreeNode n in tnc)
    {
        if (n.Value == guid)
        {
            n.Selected = true;
            return true;
        }
        else
        {
            SelectNode(guid, n.ChildNodes);
        }
    }

    return false;
}