mercredi 10 octobre 2018

Vuejs - Filter items by text and checkbox selection

Currently I can filter my data by text search on the data title.

I also output a list of checkboxes that contain my data 'categories'.

How can I filter the output by both the category checkbox selection and the text search?

Data:

 info:[
{
    "id": 1,
    "title": "Title one",
    "category_data": {
        "2": "Team",
        "7": "Queries"
    }
},
{
    "id": 2,
    "title": "Title two",
    "category_data": {
        "2": "Team",
        "7": "Queries"
    }
},
{
    "id": 3,
    "title": "Title three",
    "category_data": {
        "2": "Team",
        "7": "Queries"
    }
},
{
    "id": 4,
    "title": "Title four",
    "category_data": {
        "2": "Team",
        "7": "Queries"
    }
},
{
    "id": 5,
    "title": "Title five",
    "category_data": {
        "2": "Team",
        "6": "Questions",
        "7": "Queries"
    }
},
{
    "id": 6,
    "title": "Title six",
    "category_data": {
        "2": "Team",
        "6": "Questions",
        "7": "Queries",
        "12": "Fax",
    }
}
]

Text search:

        // Refine by title search
        return vm.info.filter(item => {
            return item.title.toLowerCase().indexOf(this.numbers_search_term.toLowerCase()) > -1
        })

CodePen example: https://codepen.io/anon/pen/XxNORW?editors=1011

Thanks




Aucun commentaire:

Enregistrer un commentaire