0

So, I have a Google Map with some locations. I'm trying to get the map markers to filter out when you click on the corresponding list item for it. The only way I can get it to work is if I put in the marker title's exact string like so:

<tbody data-bind="foreach: filteredItems()">
    <tr data-bind="click: toggleGroup('Michi Ramen')">
        <td id="listTitle" data-bind="text: $data.title"></td>
    </tr>
</tbody>

Of course, that makes each list item filter the exact thing. Putting toggleGroup.bind($data.title) doesn't work.

This is my current viewModel:

var viewModel = function(data) {
    var self = this;
    self.filters = ko.observableArray(data.filters);
    self.filter = ko.observable('');
    self.shops = data.shops;
    self.filteredItems = ko.dependentObservable(function() {
        var filter = self.filter().toLowerCase();
        if (!filter) {
            return self.shops();
        } else {
            return ko.utils.arrayFilter(self.shops(), function(Shop) {
                return Shop.title().toLowerCase().indexOf(filter) !== -1;
            });
        }
    }, viewModel);
};

And this is the function I'm using to try and filter the markers.

function toggleGroup(title) {
    var i;
    for (i = 0; i < markers.length; i++) {
        var marker = markers[i];
        if (marker.title === title) {
            marker.setVisible(true);
        } else {
            markers[i].setVisible(false);
        }
    }
}
Matheus Cuba
  • 2,068
  • 1
  • 20
  • 31
Alejandra Saldaña Guzmán
  • 1
  • 1
  • `marker.title === title` matches only if both strings have the same content. You are looking for a substring matching. This question could help you: https://stackoverflow.com/questions/1789945/how-to-check-whether-a-string-contains-a-substring-in-javascript – Jose Luis Dec 31 '17 at 09:51

1 Answers1

1

My guess is that title is an observable, so you need to do click: toggleGroup.bind($data, $data.title()). Alternatively click: function(data, event) { toggleGroup(data.title()) }.

Michael Best
  • 16,623
  • 1
  • 37
  • 70
Izabela
  • 71
  • 3