Copied to clipboard

Flag this post as spam?

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


  • Kyle Goulding 30 posts 192 karma points
    Oct 13, 2016 @ 15:09
    Kyle Goulding
    0

    Filtering a list Based on User Input

    Hi,

    I am wanting to filter a list of Courses based on user input.

    So initially I want the list to show all of the courses, then if a user clicks a button I want to pass the value to a variable which is being used in the where clause.

    Below is the code which I have got at the moment, obviously I would add in the if statements depending on which button/option has been selected by the user, but if I am able to assign a user input to the variable I am sure I will be able to fill in the rest.

    @{ var userInput = "Course Category A"; var course = CurrentPage.Site().FirstChild("coursesFolder").Children("course").Where("courseCategory == @0", @userInput).OrderBy("courseDate desc"); }

      @foreach(var item in course){
    • @item.Name @item.courseDate
    • }

    Does anyone know how I would be able to achieve this? Or do I need Umbraco forms to to this?

    Thanks in advance

  • Nik 1612 posts 7258 karma points MVP 7x c-trib
    Oct 13, 2016 @ 15:48
    Nik
    0

    Hi Kyle,

    This is completely achievable without Umbraco Forms.

    There are various options available to you, the first is to use some javascript to re-call your current page with a query string attached. You could then edit your view to process the query string.

    Alternatively, you could use a surface controller to receive the input and then return the updated list. This could be called via ajax, or it could be a complete page reload.

    Nik

  • Kyle Goulding 30 posts 192 karma points
    Oct 14, 2016 @ 11:59
    Kyle Goulding
    0

    Hi Nik,

    Thanks for your advice. Do you have any example code similar to what I am trying to achieve with the query strings or know of any tutorials which may cover this?

    Thanks for your help.

  • Kyle Goulding 30 posts 192 karma points
    Oct 14, 2016 @ 12:38
    Kyle Goulding
    0

    Hi Nik,

    I think I have figured it out...

    <h1>Courses</h1>
    
    <form action="" method="GET">
        <div class="input-group">
    
                <span class="input-group-btn" style="">
                    <button class="btn btn-hee" type="submit" name="category" value="Category A">Category A</button>
                    <button class="btn btn-hee" type="submit" name="category" value="Category B">Category B</button>
                    <button class="btn btn-hee" type="submit" name="category" value="">All</button>
                </span>
        </div>
    </form> 
    
    @{
        @*IF String is not Null*@
        if (!string.IsNullOrEmpty(Request.QueryString["category"]))
        {
            var category = Request.QueryString["category"];
            var course = CurrentPage.Site().FirstChild("coursesFolder").Children("course").Where("courseCategory == @0", @category).OrderBy("courseDate desc");
    
            <ul>
            @foreach(var item in course)
            {
                <li>
                    <a href="@item.Url">@item.Name</a>
                    @item.courseDate
                </li>
            }
            </ul>
        }
        else if(string.IsNullOrEmpty(Request.QueryString["category"]))
        {
            var course = CurrentPage.Site().FirstChild("coursesFolder").Children("course").Where("Visible");
    
            <ul>
            @foreach(var item in course)
            {
                <li>
                    <a href="@item.Url">@item.Name</a>
                    @item.courseDate
                </li>
            }
            </ul>
    
        }
    

    }

    Thanks for your help!

Please Sign in or register to post replies

Write your reply to:

Draft