none
Navigating to multiple pages using hyperlink button and frame element

    Question

  • Hi!

    I  am new to blend and silverlight. In my web application, I have a mainpage.xaml which has 4 hyperlink buttons pointing to 4 different pages. and I have a frame element to load these pages when the hyperlink buttons are clicked.   In the hyperlink element i have given the targetname as the frame element name. To the frame element i have loaded the default source as home.xaml page . When i run the application the frame is loading the the home.xaml page but when i click on the other hyperlink buttons on the main page, those are not getting loaded.

    Below is my code and i dont know where I am going wrong. Can you please help me ???? 

    <UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk" mc:Ignorable="d"
    x:Class="ArthaProject1.MainPage" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" Foreground="#FFE2DEDE" >
    <Viewbox Margin="0">

    <Grid x:Name="LayoutRoot" OpacityMask="#FFCEB4B4" >
    <Grid.Background>
    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
    <GradientStop Color="White" Offset="0"/>
    <GradientStop Color="#FF0F6FEF" Offset="1"/>
    <GradientStop Color="#FFF2F5F7" Offset="0.351"/>
    </LinearGradientBrush>
    </Grid.Background>
    <Grid Margin="300,100,300,200" Height="496" Width="789" RenderTransformOrigin="0.474,0.544">
    <Image Source="/Penguins.jpg" Margin="-5,2,118,220" OpacityMask="#B3000000"/>
    <Rectangle Margin="-192,-50,-198,-145" RadiusY="54" RadiusX="54" Stroke="Black" StrokeThickness="2" OpacityMask="Black">
    <Rectangle.Fill>
    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
    <GradientStop Color="#B2C2C2D2" Offset="0"/>
    <GradientStop Color="#FF3A15C2" Offset="1"/>
    </LinearGradientBrush>
    </Rectangle.Fill>
    </Rectangle>
    <Rectangle Margin="-191,109,-193,-71" Stroke="Black" StrokeThickness="0">
    <Rectangle.Fill>
    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
    <GradientStop Color="#B2F5F5F7" Offset="0"/>
    <GradientStop Color="#FFF5F5F7" Offset="1"/>
    </LinearGradientBrush>
    </Rectangle.Fill>
    </Rectangle>
    <Rectangle Margin="-186,155,0,55" Stroke="Black" StrokeThickness="0" RadiusY="16" RadiusX="16" HorizontalAlignment="Left" Width="196" Fill="#3A3A15C2"/>
    <HyperlinkButton Content="Home" HorizontalAlignment="Left" Height="32" Margin="-81,187,0,0" Style="{StaticResource HyperlinkArthaButn}" VerticalAlignment="Top" Width="145" TargetName="DataFrame" NavigateUri="/Home"/>
    <HyperlinkButton Content="Networking" HorizontalAlignment="Left" Margin="-79,238,0,226" Style="{StaticResource HyperlinkArthaButn}" Width="145" TargetName="DataFrame" NavigateUri="/Networking"/>
    <HyperlinkButton Content="Services" HorizontalAlignment="Left" Margin="-79,0,0,180" Style="{StaticResource HyperlinkArthaButn}" Width="145" Height="32" VerticalAlignment="Bottom" TargetName="DataFrame" NavigateUri="/Services"/>
    <HyperlinkButton Content="Contact Us" HorizontalAlignment="Left" Margin="-78,0,0,129" Style="{StaticResource HyperlinkArthaButn}" Width="145" Height="32" VerticalAlignment="Bottom" TargetName="DataFrame" NavigateUri="/ContactUs"/>
    <sdk:Frame x:Name="DataFrame" Margin="20,114,-187,-64" BorderBrush="#FF386BD6" Source="/Home">
    <sdk:Frame.UriMapper>
    <sdk:UriMapper>
    <sdk:UriMapping Uri="/{pageName}" MappedUri="/{pageName}.xaml"/>
    </sdk:UriMapper>
    </sdk:Frame.UriMapper>
    </sdk:Frame>
    </Grid>
    </Grid>
    </Viewbox>
    </UserControl>
    Thursday, May 03, 2012 10:01 AM

Answers

  • Hi,

      I tried running your code. It was working correctly. The only change i did was to remove the    Style="{StaticResource HyperlinkArthaButn}"   as i didnt have the code for that.

    Now if it still doesn't work for you, check the steps.

    1) I copied your code into the mainpage.xaml of a new project called ArthaProject1. 

    2) I added 4 new Silverlight pages (note: Not Silverlight user controls, just Silverlight pages) with the names ContactUs,Home,Networking,Services  .

    3) I put some dummy content into these pages by dragging textboxes and stuff  ( just to see whether they are updating or not )

    4) Ran the project. It is working fine and navigating between the pages

    Hope it Helps Laughing

    Thursday, May 03, 2012 2:34 PM