Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Daniel Plaetner-Cancela 7 posts 67 karma points
    May 02, 2014 @ 09:55
    Daniel Plaetner-Cancela
    0

    Sort by custom category: dropdown list

    Greetings Umbraco and friends, 

    I just started learning Umbraco, and need some help with the last bit on my website. I have made some kind of of product page / blog, since I am saying it is a blog too is that you only can watch the products, but not add them to the cart (for the moment, will perhaps be added in the future). So the concept is nearly like a blog system, just that each blog post will act like a product :) 

    So far each item has these properties. 
    image, type:Upload
    bodyText, type:Richtext editor
    Featured, type: True/false

    and then lastly a custom property
    category, Type:Category
    Where the category is where I have the problem, it is acting like a Dropdown List. And I can then add prevalues, for each of the categories. 

    As you can see on the picture, the categories work. 
    But I need to make a partial view with a unordered list with the categories, and when you click on for example Surf, it will only show all thepost with that nametag/category. I have no idea how to do this, hopefully you guys can help me out! :) 

  • Jeavon Leopold 3072 posts 13628 karma points MVP 10x admin c-trib
    May 02, 2014 @ 14:55
    Jeavon Leopold
    0

    Hi Daniel,

    Welcome to Our!

    Couple of questions:

    1. Are you using Umbraco v7.1
    2. Is your "Category" data type using DropDown List or DropDownList Publishing Keys
    3. As I understand it you need a Partial View that lists the prevalues from your Data Type and when clicked will filter the items on the page to show only items that have the prevalue, this will all occur on the same page?

    Jeavon

  • Daniel Plaetner-Cancela 7 posts 67 karma points
    May 02, 2014 @ 15:20
    Daniel Plaetner-Cancela
    0

    Greetings Jeavon,

    1. Yes I am using the newest version of Umbraco
    2. It is DropDown List, should I use DropDownList Pubblicishing keys instead?
    3. Exactly, if will then filter the items based on the prevalue you click on. I am actually not sure if it should be on the same page or an external, dont I need to create a AJAX call if it needs to be on the same?
  • Jeavon Leopold 3072 posts 13628 karma points MVP 10x admin c-trib
    May 02, 2014 @ 15:33
    Jeavon Leopold
    0

    Hi Daniel,

    Simplest solution would be to use a querystring variable link and page reload, I think DropDown is fine for this.

    I will post you some code shortly.

    Jeavon

  • Daniel Plaetner-Cancela 7 posts 67 karma points
    May 02, 2014 @ 15:35
    Daniel Plaetner-Cancela
    0

    Thanks for the quick reply! :)

  • Jeavon Leopold 3072 posts 13628 karma points MVP 10x admin c-trib
    May 02, 2014 @ 22:27
    Jeavon Leopold
    101

    Ok here we go, a couple of things you need to adjust:

    1. "-42" is the id of my dropdown data type, when editing the data type you can see the id in the address bar
    2. My property alias is called "superHero" is think yours is called "category"

    -

    @{
        var dts = ApplicationContext.Current.Services.DataTypeService;
        var preValues = dts.GetPreValuesByDataTypeId(-42);
    
        if (preValues.Any())
        {
            <ul>
                @foreach (var preValue in preValues)
                {
                <li><a href="@[email protected](preValue)">@preValue</a></li>
                }
            </ul>
        }
        var valueToMatch = HttpUtility.UrlDecode(Request.QueryString["filter"]);
    
        if (valueToMatch != null)
        {
            var articles = CurrentPage.AncestorOrSelf(1).Children.Where("superHero.ToLower().Contains(@0)", valueToMatch.ToLower());
            if (articles.Any())
            {
                <p>Pages with @valueToMatch selected:</p>
                <ul>
                    @foreach (var page in articles)
                    {
                        <li><a href="@page.Url"> @page.Name</a></li>
                    }
                </ul>
            }
        }
    }
    
  • Jeavon Leopold 3072 posts 13628 karma points MVP 10x admin c-trib
    May 02, 2014 @ 22:29
    Jeavon Leopold
    0

    Also I am filtering nodes that are the children of the root node, CurrentPage.AncestorOrSelf(1).Children you should change this for your own existing collection.

    Any problems, please post your code :-)

  • Daniel Plaetner-Cancela 7 posts 67 karma points
    May 03, 2014 @ 10:39
    Daniel Plaetner-Cancela
    0

    Thanks alot Jeavon, your code is working like a charm. Only had to modify a littlebit.

    In case anyone needs my version, here it is.

    The partial view

    var dts = ApplicationContext.Current.Services.DataTypeService;
        var preValues = dts.GetPreValuesByDataTypeId(1080);
    
        if (preValues.Any())
        {
            <ul>
                @foreach (var preValue in preValues)
                {
                <li><a href="@[email protected](preValue)">@preValue</a></li>
                }
            </ul>
        }
    

    The page showing all the items, and the filtered

    @{
     var valueToMatch = HttpUtility.UrlDecode(Request.QueryString["filter"]);
    
        if (valueToMatch != null)
        {
            var articles = CurrentPage.Children.Where("category.ToLower().Contains(@0)", valueToMatch.ToLower());
            if (articles.Any())
            {
                <p>Pages with @valueToMatch selected:</p>
                <ul>
                    @foreach (var page in articles)
                    {
                        <li><a href="@page.Url"> @page.Name</a></li>
                    }
                </ul>
            }
        }
        else
        {
            var allarticles = CurrentPage.Children.Where("Visible");
            if(allarticles.Any())
            {
                <ul>
                    @foreach(var page in allarticles)
                    {
                        <li><a href="@page.Url"> @page.Name</a></li>
                    }
                </ul>
            }
        }   
     }
    

    again thank you, you was a big help! :)

  • Jeavon Leopold 3072 posts 13628 karma points MVP 10x admin c-trib
    May 03, 2014 @ 11:07
    Jeavon Leopold
    0

    You're welcome!

  • Cheralyn Nadal 1 post 71 karma points
    Jan 04, 2016 @ 16:51
    Cheralyn Nadal
    0

    Hi Jeavon and Daniel,

    Is there a way to filter more than one dropdown list using this method do you know?

    For example, the above code filters using one property alias; I'm looking to filter using four.

    Thank you, Cheralyn

Please Sign in or register to post replies

Write your reply to:

Draft