Multiple checkbox remove non shared values in javascript

Question

So I have the following problem.

I have a set of checkboxes. First one describes categories (say some kind of businesses), and they have associated with them certain facilities.

Let's say I have

Restaurant: Parking, Free WIFI
Hotel: Venues, Parking, Free WIFI, Lunch, Drinks
Bar: Parking, Drinks

I have this information in an object I can access called typeFacilitiesLinks

{Restaurant: ["Parking", "Free WIFI"],
Hotel: ["Venues", "Parking", "Free WIFI", "Lunch", "Drinks"],
Bar: ["Parking", "Drinks"]}

So when I check Restaurant checkbox, the Parking and Free WIFI checkboxes show. When I click Bar Drinks will be shown.

var checkedArrayFacilities = [];

$(document).on('click', '.industry-checkbox', toggleFacilitiesShow);

function toggleFacilitiesShow(e) {
    var $this = $(e.currentTarget);
    var checkedIndustry = $this.val(); // E.g. Restaurant
    var $facilitiesContainer = $('.facilities_container');

    if ($this.is(':checked')) {
        var index = checkedArrayFacilities.indexOf(checkedIndustry);

        if (index > -1) {
            checkedArrayFacilities.splice(index, 1);
        } else {
            checkedArrayFacilities.push(checkedIndustry);
        }

        for (var el in typeFacilitiesLinks) {
            if (typeFacilitiesLinks.hasOwnProperty(el)) {
                if (el === checkedIndustry) {
                    $facilitiesContainer.find('.check-facility').each(function(){
                        var $input = $(this);
                        if ( $.inArray( $input.val(), typeFacilitiesLinks[checkedIndustry] ) !== -1 ) {
                            $input.parents('.single_check').addClass('show');
                           $facilitiesContainer.removeClass('hidden');
                        }
                    });
                }
            }
        }
    }
}

This works fine. What I cannot figure out is how to remove the facilities, but only those that are not repeating in the other facilities. Imagine I have all three businesses checked. I have all their facilities shown. Now if I remove Restaurant, nothing should change, since Hotel has Free WIFI, and Parking and Bar havd also Parking.

But If I had Restaurant and Bar checked and removed Bar, I should only lose the Drinks checkbox, not the Parking one.

The more options I have checked, and more facilities are shown, the more this relationship becomes complicated :S

What is the best way to fix this? All I got was just removing the facilities from the checked option, and that's not good.

A possible solution would be to reset facilities and completely recalculate every time a checkbox is checked. — Quentin Skousen
– Quentin Skousen, Commented Oct 25, 2017 at 23:26
This is actually very good. I would just show the facilities from the businesses that are in the checkedArrayFacilities array. I haven't thought of that one! — dingo_d
– dingo_d, Commented Oct 25, 2017 at 23:28
I've added my comment as an answer; if it works for you, feel free to mark it as accepted so this question doesn't end up in the "Unanswered Questions" pile. Thanks! — Quentin Skousen
– Quentin Skousen, Commented Oct 25, 2017 at 23:35

Quentin Skousen · Accepted Answer · 2017-10-25 23:34:26Z

1

If you reset typeFacilitiesLinks and completely recalculate the facilities based on the currently checked checkboxes every time a checkbox is checked, it should solve your problem.

answered Oct 25, 2017 at 23:34

Quentin Skousen

1,0572 gold badges18 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

dingo_d Over a year ago

This did it! So simple! Thanks, will accept it in 2 minutes. I've spent a good 2 hours on this one overengineering it.

Collectives™ on Stack Overflow

Multiple checkbox remove non shared values in javascript

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related