Wie kann ich die vorherige Auswahl löschen, wenn ein Asp: TreeView in einem Update ist?
-
03-07-2019 - |
Frage
Ich habe eine ASP.Net 2.0-Seite, die zwei Update enthält. Die erste Platte enthält einen TreeView. Der zweite Bereich enthält ein Etikett und wird durch eine Auswahl in dem Baum ausgelöst. Wenn ich wählen Sie einen Knoten das Etikett aktualisiert wird, wie erwartet und die TreeNode
, dass ich auf geklickt wird hervorgehoben und die zuvor ausgewählten Knoten wird nicht mehr hervorgehoben. Allerdings, wenn ein Knoten Original markiert (ausgewählt) in der Code-Behind-Highlight nicht entfernt wird, wenn ein anderer Knoten ausgewählt wird.
Das Markup
<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>
Der Code hinter
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;
}
Der am Anfang ist der erste Knoten ausgewählt. Warum ist seine Highlight nicht entfernt, wenn andere Knoten die Auswahl?
Auch fragte ich einen anderen Frage etwa die gleiche Setup , dass ich keine Antwort bekommen haben. Jede mögliche Hilfe würde geschätzt.
Bearbeiten Ich weiß, dass ChildrenAsTriggers="false"
Einstellung funktioniert, aber ich mag zu machen, den Baum wieder zu vermeiden, da es sehr groß sein kann.
Lösung 3
Das ist ein bisschen wie ein Hack sein kann, aber das wird die Auswahl auf dem Client löschen und vermeidet das Panel zu aktualisieren.
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 );
}
}
);
Es entfernt die ausgewählten Stil / Klasse von allen Baumknoten, wenn sein Wert in der ‚_SelectedNode‘ versteckten Feld enthalten ist.
GetElementsByClassName
und RemoveClassName
sind in meiner eigenen js Bibliothek sind aber offensichtlich genug.
Andere Tipps
/// <summary>
/// Remove selection from TreeView
/// </summary>
/// <param name="tree"></param>
public static void ClearTreeView(TreeView tree)
{
if (tree.SelectedNode != null)
{
tree.SelectedNode.Selected = false;
}
}
Sie müssen die Auswahl auf false für alle Knoten setzen.
Ich benutze so etwas wie dies für eine der Anwendungen (mit meinem 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;
}