title: longlistselector tool for wp8
body: <p>I'm currently working on a windows phone 8 , using <code>Longlistselector</code>. I am listing my product list, and I need to get the selected item index, using that index I need to navigate to corresponding page. How do I get the selected index from <code>longlistselector</code>? I'm getting the <code>selectedItem</code>, but I don't know how to use the <code>selecteditem</code> to get its index? Thanks in advance</p>
  
  <p>my longlist selector code is</p>
  
  <pre><code>&lt;phone:PhoneApplicationPage.Resources&gt;
          &lt;DataTemplate x:Key="trainlistitemtemplate"&gt;
              &lt;StackPanel Orientation="Horizontal"&gt;
                  &lt;Image Height="170" Width="170" Source="{Binding Imgcity}" Margin="0,0,9,0"&gt;&lt;/Image&gt;
                  &lt;StackPanel VerticalAlignment="Top"&gt;
                      &lt;TextBlock FontWeight="Bold" Text="{Binding Cityname}" /&gt;
                      &lt;TextBlock Text="{Binding Citycode}"/&gt;
                      &lt;Button Content="BOOK" BorderBrush="{x:Null}" Background="{StaticResource PhoneAccentBrush}" Click="Button_Click_1"&gt;&lt;/Button&gt;
                  &lt;/StackPanel&gt;
              &lt;/StackPanel&gt;
          &lt;/DataTemplate&gt;
  
          &lt;DataTemplate x:Name="grpheadtemplate"&gt;
              &lt;Border Background="Transparent" Padding="5"&gt;
                  &lt;Border Background="{StaticResource PhoneAccentBrush}" BorderBrush="{StaticResource PhoneAccentBrush}" BorderThickness="2" Width="62" 
                          Height="62" Margin="0,0,18,0" HorizontalAlignment="Left"&gt;
                      &lt;TextBlock Text="{Binding Key}" Foreground="{StaticResource PhoneForegroundBrush}" FontSize="48" Padding="6" 
                                  FontFamily="{StaticResource PhoneFontFamilySemiLight}" HorizontalAlignment="Left" VerticalAlignment="Center"&gt;
                      &lt;/TextBlock&gt;
                  &lt;/Border&gt;
              &lt;/Border&gt;
          &lt;/DataTemplate&gt;
  
          &lt;phone:JumpListItemBackgroundConverter x:Key="BackgroundConverter"/&gt;
          &lt;phone:JumpListItemForegroundConverter x:Key="ForegroundConverter"/&gt;
          &lt;Style x:Key="trainlist" TargetType="phone:LongListSelector"&gt;
              &lt;Setter Property="GridCellSize"  Value="113,113"/&gt;
              &lt;Setter Property="LayoutMode" Value="Grid" /&gt;
              &lt;Setter Property="ItemTemplate"&gt;
                  &lt;Setter.Value&gt;
                      &lt;DataTemplate&gt;
                          &lt;Border Background="{Binding Converter={StaticResource BackgroundConverter}}" Width="113" Height="113" Margin="6" &gt;
                              &lt;TextBlock Text="{Binding Key}" FontFamily="{StaticResource PhoneFontFamilySemiBold}" FontSize="48" Padding="6" 
                 Foreground="{Binding Converter={StaticResource ForegroundConverter}}" VerticalAlignment="Center"/&gt;
                          &lt;/Border&gt;
                      &lt;/DataTemplate&gt;
                  &lt;/Setter.Value&gt;
              &lt;/Setter&gt;
          &lt;/Style&gt;
      &lt;/phone:PhoneApplicationPage.Resources&gt;
      &lt;!--LayoutRoot is the root grid where all page content is placed--&gt;
      &lt;Grid x:Name="LayoutRoot" Background="Transparent"&gt;
          &lt;Grid.RowDefinitions&gt;
              &lt;RowDefinition Height="Auto"/&gt;
              &lt;RowDefinition Height="*"/&gt;
          &lt;/Grid.RowDefinitions&gt;
  
          &lt;!--TitlePanel contains the name of the application and page title--&gt;
          &lt;StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28"&gt;
              &lt;TextBlock x:Name="ApplicationTitle" Text="Select Destination" Style="{StaticResource PhoneTextNormalStyle}" FontSize="40" FontFamily="Batang" FontWeight="Bold"/&gt;
          &lt;/StackPanel&gt;
  
          &lt;!--ContentPanel - place additional content here--&gt;
  
          &lt;Grid Grid.Row="1"&gt;
              &lt;phone:LongListSelector HorizontalAlignment="Left" Height="703" Margin="10,10,0,-36" VerticalAlignment="Top" Width="458" x:Name="lls1"
                                      Background="Transparent" HideEmptyGroups="True" LayoutMode="List" IsGroupingEnabled="True"
                                      ItemTemplate="{StaticResource trainlistitemtemplate}" GroupHeaderTemplate="{StaticResource grpheadtemplate}"
                                      JumpListStyle="{StaticResource trainlist}" MouseLeftButtonDown="lls1_MouseLeftButtonDown" SelectionChanged="lls1_SelectionChanged"/&gt;
          &lt;/Grid&gt;
      &lt;/Grid&gt;
  </code></pre>