Element is already the child of another element.

5 posts, 1 answers
  1. Efthymios
    Efthymios avatar
    17 posts
    Member since:
    Apr 2012

    Posted 10 Sep 2012 Link to this post

    Hello,
    I have the following RadLIstPicker in a page of my application:
    <telerikInput:RadListPicker x:Name="GPSAccuracyListPicker" Margin="0,15,0,0" VerticalAlignment="Stretch" Header="GPS Accuraccy:" IsExpanded="False">
        <ListBoxItem x:Name="VeryLowListBoxItem" Content="Very Low"/>
        <ListBoxItem x:Name="LowListBoxItem" Content="Low"/>
        <ListBoxItem x:Name="MediumListBoxItem" Content="Medium"/>
        <ListBoxItem x:Name="HighListBoxItem" Content="High"/>
        <ListBoxItem x:Name="VeryHighListBoxItem" Content="Very High"/>
        <ListBoxItem x:Name="ExtremeListBoxItem" Content="Extreme"/>
    </telerikInput:RadListPicker>

    When I run the application, I get the following message:
    System.InvalidOperationException was unhandled
      Message=Element is already the child of another element.
      StackTrace:
           at MS.Internal.XcpImports.CheckHResult(UInt32 hr)
           at MS.Internal.XcpImports.SetValue(IManagedPeerBase obj, DependencyProperty property, DependencyObject doh)
           at MS.Internal.XcpImports.SetValue(IManagedPeerBase doh, DependencyProperty property, Object obj)
           at System.Windows.DependencyObject.SetObjectValueToCore(DependencyProperty dp, Object value)
           at System.Windows.DependencyObject.SetEffectiveValue(DependencyProperty property, EffectiveValueEntry& newEntry, Object newValue)
           at System.Windows.DependencyObject.UpdateEffectiveValue(DependencyProperty property, EffectiveValueEntry oldEntry, EffectiveValueEntry& newEntry, ValueOperation operation)
           at System.Windows.DependencyObject.SetValueInternal(DependencyProperty dp, Object value, Boolean allowReadOnlySet)
           at System.Windows.DependencyObject.SetValueInternal(DependencyProperty dp, Object value)
           at System.Windows.DependencyObject.SetValue(DependencyProperty dp, Object value)
           at System.Windows.Controls.ContentControl.set_Content(Object value)
           at Telerik.Windows.Controls.RadListPicker.SetSingleSelectionModeSummary(Object content)
           at Telerik.Windows.Controls.RadListPicker.SyncPopupLabelContent()
           at Telerik.Windows.Controls.RadListPicker.UpdateExpandCollapseMode()
           at Telerik.Windows.Controls.RadListPicker.UpdateInitialState()
           at Telerik.Windows.Controls.RadListPicker.OnApplyTemplate()
           at System.Windows.FrameworkElement.OnApplyTemplate(IntPtr nativeTarget)
           at MS.Internal.XcpImports.MeasureNative(IntPtr element, Single inWidth, Single inHeight)
           at MS.Internal.XcpImports.UIElement_Measure(UIElement element, Size availableSize)
           at System.Windows.UIElement.Measure(Size availableSize)
           at System.Windows.Controls.ScrollContentPresenter.MeasureOverride(Size constraint)
           at System.Windows.FrameworkElement.MeasureOverride(IntPtr nativeTarget, Double inWidth, Double inHeight, Double& outWidth, Double& outHeight)
           at MS.Internal.XcpImports.MeasureNative(IntPtr element, Single inWidth, Single inHeight)
           at MS.Internal.XcpImports.UIElement_Measure(UIElement element, Size availableSize)
           at System.Windows.UIElement.Measure(Size availableSize)
           at System.Windows.Controls.ScrollViewer.MeasureOverride(Size constraint)
           at System.Windows.FrameworkElement.MeasureOverride(IntPtr nativeTarget, Double inWidth, Double inHeight, Double& outWidth, Double& outHeight)
           at MS.Internal.XcpImports.MeasureOverrideNative(IntPtr element, Single inWidth, Single inHeight, Single& outWidth, Single& outHeight)
           at MS.Internal.XcpImports.FrameworkElement_MeasureOverride(FrameworkElement element, Size availableSize)
           at System.Windows.FrameworkElement.MeasureOverride(Size availableSize)
           at Microsoft.Phone.Controls.PivotItem.MeasureOverride(Size availableSize)
           at System.Windows.FrameworkElement.MeasureOverride(IntPtr nativeTarget, Double inWidth, Double inHeight, Double& outWidth, Double& outHeight)

    But when I change the InlineModeThreshold property and enter a value larger that the items of my list box, everything seems working fine.

    Is this any kind of a component bug or I do something wrong?

    Thank you very much.

    Efthymios Kalyviotis
  2. Lancelot
    Lancelot avatar
    251 posts
    Member since:
    Jul 2012

    Posted 12 Sep 2012 Link to this post

    Hi Efthymios,

    This may be due to the fact that you don't have an ItemTemplate for the popup. Here is an example of a popup template:

    <telerikInput:RadListPicker.PopupItemTemplate>
          <DataTemplate>
                     <StackPanel Orientation="Horizontal" Margin="0, 27, 0, 24">
                            <TextBlock Text="Bind your item name here" Margin="16 -8 0 0"/>
                     </StackPanel>
             </DataTemplate>
    </telerikInput:RadListPicker.PopupItemTemplate>


    You have setup the popup threshold lower than the amount of items. The control will then assume you want it to popup because there are more items than slots in the drop down. If you do not have a template to handle the items, you'll get an exception. Here is a snippet from the documentation.

    The Inline mode of the RadListPicker control is only active when the count of the items in it is equal or less than the value of its InlineModeTreshold property. The default value of this property is 5, but you can change it to a desired value. When the count of the item is bigger than the InlineModeTreshold value, the RadListPicker control runs in Popup mode. More about it can be found here. 

    You'll need to go to this link and learn about Popup mode.

    Good Luck,
    Lancelot


  3. DevCraft banner
  4. Kiril Stanoev
    Admin
    Kiril Stanoev avatar
    1511 posts

    Posted 13 Sep 2012 Link to this post

    Hi Efthymios,

    There are couple of ways to workaround the issue you've encountered. One is, as Lance explained, to set a PopupItemTemplate. If you don't require a popup mode, then all you have to do is set the InlineModeTreshold property to a number greater than the number of items you want to display (ex. InlineModeTreshold="10").

    Give it a try and let me know how it works.

    Regards,
    Kiril Stanoev
    the Telerik team

    Time to cast your vote for Telerik! Tell DevPro Connections and Windows IT Pro why Telerik is your choice. Telerik is nominated in a total of 25 categories.

  5. Efthymios
    Efthymios avatar
    17 posts
    Member since:
    Apr 2012

    Posted 14 Sep 2012 Link to this post

    Hi Kiril & Lancelot,
    thank you very much for your prompt replies. The Telerik team has very good support and really enjoy communication with them.

    Unfortunately, there was not any luck with these answers.
    I send you the full XAML file in case you want to investigate it.

    <phone:PhoneApplicationPage
        x:Class="RadControlsWindowsPhoneApp1.MainPage"
        xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
        xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
        xmlns:telerikInput="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Input"
        mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
        FontFamily="{StaticResource PhoneFontFamilyNormal}"
        FontSize="{StaticResource PhoneFontSizeNormal}"
        Foreground="{StaticResource PhoneForegroundBrush}"
        SupportedOrientations="Portrait"  Orientation="Portrait"
        shell:SystemTray.IsVisible="True">
     
        <!--LayoutRoot is the root grid where all page content is placed-->
        <Grid x:Name="LayoutRoot" Background="Transparent">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
     
            <!--TitlePanel contains the name of the application and page title-->
            <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
                <TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
                <TextBlock x:Name="PageTitle" Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
            </StackPanel>
     
            <!--ContentPanel - place additional content here-->
            <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
                <telerikInput:RadListPicker x:Name="GPSAccuracyListPicker" Margin="0,15,0,0" VerticalAlignment="Stretch" Header="GPS Accuraccy:" IsExpanded="False" InlineModeThreshold="5">
                    <telerikInput:RadListPicker.PopupItemTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Horizontal" Margin="0, 27, 0, 24">
                                <TextBlock Text="Bind your item name here" Margin="16 -8 0 0"/>
                            </StackPanel>
                        </DataTemplate>
                    </telerikInput:RadListPicker.PopupItemTemplate>
                    <ListBoxItem x:Name="VeryLowListBoxItem" Content="Very Low"/>
                    <ListBoxItem x:Name="LowListBoxItem" Content="Low"/>
                    <ListBoxItem x:Name="MediumListBoxItem" Content="Medium"/>
                    <ListBoxItem x:Name="HighListBoxItem" Content="High"/>
                    <ListBoxItem x:Name="VeryHighListBoxItem" Content="Very High"/>
                    <ListBoxItem x:Name="ExtremeListBoxItem" Content="Extreme"/>
                </telerikInput:RadListPicker>
            </Grid>
        </Grid>
     
    </phone:PhoneApplicationPage>
      


    I am really a dummy in C# and XAML, so it may be my mistake (not quite sure if PopupItemTemplate should be inside RadListPicker but seems to work).
    In case you need, I work with the following version:

    RadControls for Windows Phone 2012.2 801


    Inline mode works perfectly, but popup mode doesn't (the one I am interested since the list has a lot of elements).

    Thank you very much.

    Efthymios Kalyviotis
  6. Answer
    Lancelot
    Lancelot avatar
    251 posts
    Member since:
    Jul 2012

    Posted 14 Sep 2012 Link to this post

    hi Efthymios,

    You're almost there :) The main problem you're having is you are trying to use the hard coded XAML values in the popup template. If you are going to use the Popup Template you'll need to use a list object. I gone ahead and written you a sample program that demonstrates three different ways to use ListPicker. Each one is in it's own pivot and I've left you comments in the code to follow along with what I did.

    If you want to see the entire application, give me a location I can upload the project to for you (for instance DropBox) because we can't add project files here.

    Here is the MainPage.xaml.cs
    <controls:Pivot Title="MY APPLICATION">
          <controls:PivotItem x:Name="ListPickerOne" Header="Inline">
                    <Grid>
                        <telerikInput:RadListPicker x:Name="GPSAccuracyListPicker"
                                                    Margin="0"
                                                    VerticalAlignment="Top"
                                                    Header="GPS Accuraccy:"
                                                    IsExpanded="False"
                                                    InlineModeThreshold="8">
                            <!-- You can't popluate the popup item template from a hard coded XAML values like this list.
                            See the second ListPicker below.-->
                            <ListBoxItem x:Name="VeryLowListBoxItem" Content="Very Low"/>
                            <ListBoxItem x:Name="LowListBoxItem" Content="Low"/>
                            <ListBoxItem x:Name="MediumListBoxItem" Content="Medium"/>
                            <ListBoxItem x:Name="HighListBoxItem" Content="High"/>
                            <ListBoxItem x:Name="VeryHighListBoxItem" Content="Very High"/>
                            <ListBoxItem x:Name="ExtremeListBoxItem" Content="Extreme"/>
                        </telerikInput:RadListPicker>
     
                    </Grid>
          </controls:PivotItem>
          <controls:PivotItem x:Name="ListPickerTwo" Header="PopUp">
                    <Grid>
                        <telerikInput:RadListPicker x:Name="RadPopupListPicker"
                                                    InlineModeThreshold="4"
                                                    Margin="0" Header="PopUp Listpicker example">
                            <!-- Here is the item template to hold the pop up values. You'll need a list object to
                            hold the string values for the template. I took the same values and placed them into a List
                            in the code behind. See the constructor in MainPage.xaml.cs-->
                            <telerikInput:RadListPicker.PopupItemTemplate>
                                <DataTemplate>
                                    <StackPanel Orientation="Horizontal" Margin="0, 27, 0, 24">
                                        <TextBlock Text="{Binding}" Margin="16 -8 0 0"/>
                                    </StackPanel>
                                </DataTemplate>
                            </telerikInput:RadListPicker.PopupItemTemplate>
                        </telerikInput:RadListPicker>
                    </Grid>
          </controls:PivotItem>
          <controls:PivotItem x:Name="MvvmPicker" Header="VM Binding">
            <Grid>
                <telerikInput:RadListPicker x:Name="MvvMPopupListPicker"
                                            ItemsSource="{Binding Items}"
                                            InlineModeThreshold="4"
                                            Margin="0"
                                            Header="PopUp Listpicker example">
                     <!-- Here I use the ViewModel to provide the ListPicker with values.
                       It's nice and simple, just Bind the ItemsSource and then bind the value to the text property in the textblock-->
                    <telerikInput:RadListPicker.PopupItemTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Horizontal" Margin="0, 27, 0, 24">
                                <TextBlock Text="{Binding LineOne}" Margin="16 -8 0 0"/>
                            </StackPanel>
                        </DataTemplate>
                    </telerikInput:RadListPicker.PopupItemTemplate>
                </telerikInput:RadListPicker>
            </Grid>
          </controls:PivotItem>
          <!--Pivot item one-->
          <controls:PivotItem Header="first">
            <!--Double line list with text wrapping-->
            <ListBox x:Name="FirstListBox" Margin="0,0,-12,0" ItemsSource="{Binding Items}">
              <ListBox.ItemTemplate>
                <DataTemplate>
                  <StackPanel Margin="0,0,0,17" Width="432">
                    <TextBlock Text="{Binding LineOne}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
                    <TextBlock Text="{Binding LineTwo}" TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}"/>
                  </StackPanel>
                </DataTemplate>
              </ListBox.ItemTemplate>
            </ListBox>
          </controls:PivotItem>
        </controls:Pivot>

    And here is the MainPage.xaml.cs
    public partial class MainPage : PhoneApplicationPage
        {
            // Constructor
            public MainPage()
            {
                InitializeComponent();
     
                // This code is to set the datacontext to the ViewModel
                DataContext = App.ViewModel;
                this.Loaded += new RoutedEventHandler(MainPage_Loaded);
     
                //Here I create a list of strings that will get set as the ItemsSource of the RadListPicker. See how I've taken the same values you've hard coded in the xaml and hard coded them here.
                List<string> MyListPickerItemsToGetBoundToPopUp = new List<string>() { "VeryLowListBoxItem", "LowListBoxItem", "MediumListBoxItem", "HighListBoxItem", "VeryHighListBoxItem", "ExtremeListBoxItem" };
     
                //Now I take that list and attach it to the itemssource of the second RadListPicker
                this.RadPopupListPicker.ItemsSource = MyListPickerItemsToGetBoundToPopUp;
            }
     
            void MainPage_Loaded(object sender, RoutedEventArgs e)
            {
                if (!App.ViewModel.IsDataLoaded)
                {
                    App.ViewModel.LoadData();
                }      
            }


    This should clear things up for you and get you up & running in no time, good luck!
    Lancelot
Back to Top
DevCraft banner