Forums Neueste Beiträge
 

Navigation und Masterpage

09/08/2008 - 11:20 von Andrej Golubew | Report spam
Guten Tag zusammen,
ich habe ein Problem mit Navigation auf die Seite. Meine Seite ist wie folgt
aufgebaut:
Oben – DIV header
Links – DIV menu
Rechts - DIV content
Unten – DIV footer
Menu besteht aus mehrere Panel, die ich ein und ausschalte. Ich möchte
gerne in DIV-content die angezeigte Information àndern, sobald der User auf
irgendein Menüpunkt klickt. Es klappt sehr gut mit Master. Nur ich habe bei
ein Menüpunkt(Panel1) eine Untermenü auch als Panel(Panel2), beim klicken auf
ImageButton1 (aus Panel1) wird Panel2 visible. Danach klickt user auf ein
Linkbutton in Panel2, es muss die Inhalt in DIV – content geàndert werden(es
wir neue Page mit Masterpage geladen). Beim laden von diese Page wird der
Panel2 wieder unsichtbar.
Hier die Code:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="default1.aspx.cs"
Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xht...">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Hansa Eule</title>
<link href="default.css" rel="stylesheet" type="text/css" media="screen"
/>
<style type="text/css">
.style1
{
width: 100%;
height: 97px;
}
.style2
{
width: 27px;
}
</style>
</head>
<body>
<form id="frmMain" runat="server">
<div id="header">
<div id="logo">

</div>
</div>
<div id="menu" >

<asp:Panel ID="Panel1" runat="server"
style="top: 19px; left: 10px; position: relative; height: 27px"
Width="125px">
<asp:ImageButton ID="ImageButton1" runat="server"
ImageUrl="~/bilder/button_m1.png"
onclick="ImageButton1_Click" />
</asp:Panel>
<asp:Panel ID="Panel2" runat="server"
style="position: relative; top: 32px; left: 18px; height: 147px"
Width="125px" Visible="False">
<table class="style1">
<tr>
<td class="style2">
<asp:Image ID="Image1" runat="server"
ImageUrl="~/bilder/null.png"
ImageAlign="Middle" style="margin-right: 0px" />
</td>
<td>
<asp:LinkButton ID="LinkButton1" runat="server"
PostBackUrl="~/default.aspx"

onclick="LinkButton1_Click">Bremen</asp:LinkButton>
</td>
</tr>
<tr>
<td class="style2">
<asp:Image ID="Image2" runat="server"
ImageUrl="~/bilder/null.png"
ImageAlign="Middle" style="margin-right: 0px"
/></td>
<td>
<asp:LinkButton ID="LinkButton2" runat="server"
PostBackUrl="~/default.aspx"

onclick="LinkButton2_Click">Berlin</asp:LinkButton>
</td>
</tr>
<tr>
<td class="style2">
<asp:Image ID="Image3" runat="server"
ImageUrl="~/bilder/null.png"
ImageAlign="Middle" style="margin-right: 0px"
/></td>
<td>
Delmenhorst</td>
</tr>
<tr>
<td class="style2">
<asp:Image ID="Image4" runat="server"
ImageUrl="~/bilder/null.png"
ImageAlign="Middle" style="margin-right: 0px"
/></td>
<td>
Hamburg</td>
</tr>
<tr>
<td class="style2">
<asp:Image ID="Image5" runat="server"
ImageUrl="~/bilder/null.png"
ImageAlign="Middle" style="margin-right: 0px"
/></td>
<td>
Hannover</td>
</tr>
<tr>
<td class="style2">
<asp:Image ID="Image6" runat="server"
ImageUrl="~/bilder/null.png"
ImageAlign="Middle" style="margin-right: 0px"
/></td>
<td>
Magdeburg</td>
</tr>
</table>
</asp:Panel>
<asp:Panel ID="Panel3" runat="server"
style="top: 50px; left: 10px; position: relative; height: 27px;
margin-bottom: 16px;"
Width="125px">
<asp:ImageButton ID="ImageButton2" runat="server"
ImageUrl="~/bilder/button_m2.png" />
</asp:Panel>
<asp:Panel ID="Panel4" runat="server"
style="top: 60px; left: 10px; position: relative; height: 27px;
margin-bottom: 16px;"
Width="125px">
<asp:ImageButton ID="ImageButton3" runat="server"
ImageUrl="~/bilder/button_m3.png" />
</asp:Panel>
<asp:Panel ID="Panel5" runat="server"
style="top: 70px; left: 10px; position: relative; height: 27px;
margin-bottom: 16px;"
Width="125px">
<asp:ImageButton ID="ImageButton4" runat="server"
ImageUrl="~/bilder/button_m4.png" />
</asp:Panel>
</div>
<div id="content">

</div>
<div id="footer">

</div>
</form>
</body>
</html>




using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class MasterPage : System.Web.UI.MasterPage
{
protected void Page_Load(object sender, EventArgs e)
{

}
protected void ImageButton1_Click(object sender, ImageClickEventArgs e)
{
if (Panel2.Visible)
{
Panel2.Visible = false;
ImageButton1.ImageUrl = "~/bilder/button_m1.png";
}
else
{
Panel2.Visible = true;
ImageButton1.ImageUrl = "~/bilder/button_m1_active.png";
}

}

protected void LinkButton2_Click(object sender, EventArgs e)
{
Image2.ImageUrl = "~/bilder/strelka.png";
Image1.ImageUrl = "~/bilder/null.png";
}
protected void LinkButton1_Click(object sender, EventArgs e)
{
Image1.ImageUrl = "~/bilder/strelka.png";
Image2.ImageUrl = "~/bilder/null.png";
}
}
 

Lesen sie die antworten

#1 Gerold Mittelstädt
09/08/2008 - 12:21 | Warnen spam
Hallo Andrej,

Andrej Golubew schrieb:
Guten Tag zusammen,
ich habe ein Problem mit Navigation auf die Seite. Meine Seite ist wie folgt
aufgebaut:
Oben – DIV header
Links – DIV menu
Rechts - DIV content
Unten – DIV footer
Menu besteht aus mehrere Panel, die ich ein und ausschalte.
Ich möchte
gerne in DIV-content die angezeigte Information àndern, sobald der User auf
irgendein Menüpunkt klickt.



<a href="~/andererInhalt.aspx" runat="server">Klick</a>
<a href="~/nochwasAnderes.aspx" runat="server">Klick 2</a>
oder über PostBacks?

Es klappt sehr gut mit Master. Nur ich habe bei
ein Menüpunkt(Panel1) eine Untermenü auch als Panel(Panel2), beim klicken auf
ImageButton1 (aus Panel1) wird Panel2 visible. Danach klickt user auf ein
Linkbutton in Panel2, es muss die Inhalt in DIV – content geàndert werden(es
wir neue Page mit Masterpage geladen). Beim laden von diese Page wird der
Panel2 wieder unsichtbar.



Wie làdst Du denn die neue Seite? Nicht über ein PostBack mit
anschließendem Response.Redirect, oder?

Der Status, was ist sichtbar, was nicht, wird im ViewState gespeichert.
Dieser ist beim Aufruf einer neuen Seite nicht mehr da. Daher wird alles
auf "Anfang" gesetzt. Du musst Dir also selbst merken/herausinden, wass
wann wie wo sichtbar und unsichtbar sein muss. Bei Navigation làsst sich
da z.B. der URL (auch in Zusammenhang mit URL-Rewriting) auslesen und
auswerten (der bei sowas am Besten auch hierarchisch organisiert ist).

Also

meine.tld/default.aspx
meine.tld/Staedte/Bremen.aspx
meine.tld/Steadte/Berlin.aspx
usw..

Hier der Code:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="default1.aspx.cs"
Inherits="_Default" %>

public partial class MasterPage : System.Web.UI.MasterPage



Da passt was nicht zusamnen. ;)

Wenn Du jedesmal einen Roundtrip auslöst und das dann als normale
Navigation verwendest, hast Du ganz schnell das Problem, dass Coogle&Go.
Dich nicht finden.
Sinnvoller wàre hier z.B. das ganze Menü immer komplett auszugeben und
betreffende Bereich z.B. über JavaScript ein und auszublenden. Empfehlen
könnte ich hierzu mootools.net.

protected void LinkButton2_Click(object sender, EventArgs e)
{
Image2.ImageUrl = "~/bilder/strelka.png";
Image1.ImageUrl = "~/bilder/null.png";
}
protected void LinkButton1_Click(object sender, EventArgs e)
{
Image1.ImageUrl = "~/bilder/strelka.png";
Image2.ImageUrl = "~/bilder/null.png";
}



So ganz versteh ich das nicht. Du tauscht ja nur Bilder aus? Wie findet
die eigentliche Seitenànderung statt?

Generell würde ich auch eher eine CSS-Klasse 'aktiv' anlegen, die die
Bilder für die betrefefnden Links (als background) setzt. Spart ne Menge
schreibarbeit..

Viele Grüße!

Ähnliche fragen