JumpList in DataForm

6 posts, 0 answers
  1. Rob
    Rob avatar
    11 posts
    Member since:
    Jan 2013

    Posted 03 Dec 2015 Link to this post

    Is it possible to have a JumpList as the editor in a DataForm? I have a DataField defined as follows:

                         <telerikInput:DataField TargetProperty="UserStreetName" Header="Street">
                            <telerikInput:DataField.EditorStyles>
                                <Style TargetType="telerikInput:RadListPicker">
                                    <Setter Property="PopupHeader" Value="Street"/>
                                    <Setter Property="DisplayMemberPath" Value="Id" />
                                    <Setter Property="SelectedValuePath" Value="Id" />
                                </Style>
                            </telerikInput:DataField.EditorStyles>
                        </telerikInput:DataField>

     But due to the large number of items in this particular ListPicker, it is difficult to scroll through thousands of items to find the correct one. Is it possible to display a JumpList instead? I would like it to be able to present the user with a jumplist, similar to the "phone book" sample in the "Telerik Examples" app

  2. Ivaylo Gergov
    Admin
    Ivaylo Gergov avatar
    661 posts

    Posted 08 Dec 2015 Link to this post

    Hello,

    Here you can find how to create CustomEditors.

    I hope this helps.

    Regards,
    Ivaylo Gergov
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. DevCraft banner
  4. Rob
    Rob avatar
    11 posts
    Member since:
    Jan 2013

    Posted 15 Mar Link to this post

    Hello,

    I have reviewed the information provided regarding custom editors, and I have attempted unsuccessfully to implement my desired functionality.

    Can you provide some guidance on how I would go about getting a custom editor to "popup". I need the custom editor to popup, similar to the way RadListPicker pops up to allow selection. Once it pops up, this custom editor would display something similar to the attached image. I am trying to implement a way that the user could filter a large list, based on typing the first few characters (rather than scroll through thousands of items.

    Thanks

    -Rob

  5. Ves
    Admin
    Ves avatar
    2879 posts

    Posted 18 Mar Link to this post

    Hi Rob,

    I have attached an updated version of the DataForm example from our QSF (found in C:\Program Files (x86)\Telerik\UI for Windows Phone 8 folder). This version features an updated template of RadListPicker, which uses RadJumpList with a group descriptor. Tthis approach relies on the fact, that there is a control in RadListPicker's template, that is named PopupList and it is of type RadDataBoundListBox (RadJumpList inherits from it).

    You can extend this approach further by adding additional controls and features to the RadListPicker custom template, keeping the above requirement satisfied.

    Best regards,
    Ves
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  6. Rob
    Rob avatar
    11 posts
    Member since:
    Jan 2013

    Posted 21 Mar in reply to Ves Link to this post

    Hello, thanks for the template. It is very helpful.

    Below is my attempt at using the template to accomplish the filtering functionality. This code "works" but is not very reusable. The filtering currently is being done at the page level, not as a custom editor.

    I am not seeing a way to refactor this functionality into a custom editor, due to the following.

    -Can't see a way to use the template you provided as a part of a user control/custom editor.
    -Don't see a way to "get at" the associated RadDataField properties (to determine bindings, i.e. which IGenericListFieldInfoProvider is associated with the bound field on my model [GenericListEditor])

    I am hoping to use this functionality in all of my list driven dataform fields, but my current approach is inelegant. Any suggestions on how to get this into a custom editor?

    Thanks
    -Rob

    FirstLook.xaml
                            <telerikPrimitives:RadWindow.Content>
                                <Grid 
                                        Background="{StaticResource PhoneChromeBrush}"
                                        telerikCore:RadTileAnimation.ContainerToAnimate="{Binding ElementName=PopupList, Path=.}">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="Auto" />
                                        <RowDefinition Height="Auto" />
                                        <RowDefinition Height="*" />
                                    </Grid.RowDefinitions>
                                    <ContentControl Grid.Row="0" CacheMode="BitmapCache"
                                                Content="{TemplateBinding PopupHeader}"
                                                ContentTemplate="{TemplateBinding PopupHeaderTemplate}"
                                                Style="{TemplateBinding PopupHeaderStyle}" />
                                    <telerikPrimitives:RadTextBox Grid.Row="1" x:Name="search" Watermark="search" TextChanged="search_TextChanged"/>
                                    <telerikData:RadJumpList Grid.Row="2" x:Name="PopupList"
                                                telerikCore:InteractionEffectManager.IsInteractionEnabled="True"
                                                Style="{TemplateBinding PopupStyle}"
                                                IsCheckModeActive="False"
                                                DisplayMemberPath="{TemplateBinding DisplayMemberPath}"
                                                ItemContainerStyle="{TemplateBinding PopupItemStyle}"
                                                CheckModeDeactivatedOnBackButton="False" >
                                    </telerikData:RadJumpList>
                                </Grid>
                            </telerikPrimitives:RadWindow.Content>



    Firstlook.xml.cs

            Dictionary<String, IEnumerable> masterlists = new Dictionary<string, IEnumerable>();
            
            private void search_TextChanged(object sender, TextChangedEventArgs e)
            {
                // the textbox text changed (user is "filtering" the list)
                RadTextBox searchbox = (RadTextBox)sender;
                // the text that the user typed
                String filter = searchbox.Text.ToUpper();

                // try to find the jumplist
                RadJumpList jumplist = (RadJumpList)searchbox.FindName("PopupList");

                // try to find the header, I will use this to try to track the full list, before filtering
                ContentControl header = (ContentControl)searchbox.FindName("HeaderPresenter");
                String listid = header.Content.ToString();

                // keep track of all "full lists" (need to do this because user may backspace in the TextBox and will need to restore the list to what it was originally, prior to filtering)
                if (masterlists.ContainsKey(listid) == false)
                {
                    masterlists[listid] = jumplist.ItemsSource;
                }

                // filter based on what was typed in the text box
                var temp = masterlists[listid];
                List<String> filtered = new List<string>();
                foreach(var x in temp)
                {
                    if (x.ToString().ToUpper().StartsWith(filter))
                        filtered.Add(x.ToString());
                }
                jumplist.ItemsSource = filtered;
            }


  7. Ves
    Admin
    Ves avatar
    2879 posts

    Posted 24 Mar Link to this post

    Hi Rob,

    You can place the template in App.xaml and reuse it across the application. You can eliminate the TextChanged event handler by databinding the FilterDescriptorsSource property of RadJumpList to search textbox's Text property with a converter. I have attached the updated version of the page along with App.xaml.

    Best regards,
    Ves
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
DevCraft banner