Filter repeat in masonry

In theory this should work to filter 2 items in the masonry repeat.

<div class="row" is="dmx-masonry" id="masonry1" dmx-bind:repeat="view_members.data.repeat.where(`member_name.lowercase()`, inp_filter.value.lowercase(), 'startsWith').where(`member_surname.lowercase()`, inp_filter.value.lowercase(), 'startsWith')" columns="1" columns-sm="1" columns-md="2" columns-lg="4" columns-xl="6">

However for some reason it is not working on either first name or surname.

If I use

<div class="row" is="dmx-masonry" id="masonry1" dmx-`bind:repeat="view_members.data.repeat.where(`member_name.lowercase()`, inp_filter.value.lowercase(), 'startsWith')" columns="1" columns-sm="1" columns-md="2" columns-lg="4" columns-xl="6">

Then works but only on the first name

Does anyone have any idea where I am going wrong with this ?

When pasting code in the forum please follow:

oops sorry about that, is that better??

1 Like

Hopefully someone can give me an idea where this is going wrong so I can carry on working :wink:

I see you posted the same question an year ago:

you are correct I did ask the same thing and I have tried everything that is one there, but it is not working. It will work with one, but as soon as I add the other one they BOTH stop working.
This is where I am stuck as it should be working but it is not.

Could you explain what filter you want to exactly apply.

In the first expression you say: Filter view_members.data on member_name starts with inp_filter and member_surname starts with inp_filter.

I don’t think there are many members where both name and surname start with the same characters.

Internally the expression first executes the first where formatter and returns the filtered result and then the filtered result is passed to the second where which will then filter that even further.

I think for your situation it is better to use the Data View component, give view_members.data as Data Source and in the Filter use

member_name.lowercase().startsWith(inp_filter.value.lowercase()) || member_surname.lowercase().startsWith(inp_filter.value.lowercase())

The bind the data property from the Data View to your masonry repeat.

The advantage of the Data View is that you can have more complex filter, sorting and paging support.

so what I want to be able to filter the list by either the first name (member_name) or surname (member_surname)

Cheers @Patrick that worked like a charm :slight_smile: