Search code examples
javascripthtmlyui3

using YUI.all checking for classes and adding classes


in jQuery I would do it differently but I am editing YUI code and am trying not to mix and match.

I have an HTML item like this:

<div class="market">
    <button class="area1 region03 optionSelected" data-type="market" data-vendor="1">Tulsa</button>
    <button class="area1 region03" data-type="market" data-vendor="1">Houston</button>
    <button class="area1 region03" data-type="market" data-vendor="1">Kansas City</button>
</div>
<div class="region">
    <button class="area1 region03" data-type="region" data-vendor="1">Midwest</button>
</div>

The possible options are that it has a class of optionSelected or preOptionSelected. If I click on it directly it is optionSelected and I don't want anything else to bother it. But if I click on another button it needs to test if it (and all other buttons in the same data-type) have optionSelected in the class.

Right now I'm using the following to apply preOptionSelected to all buttons in the data-type:

VZW.all('.region03').addClass('preOptionSelected');

This adds the class preOptionSelected but I want it to test for optionSelected first. I'm also migrating to data- for each region and area - how do I test for those?


Solution

  • My edits got eaten. You could possibly simplify your check to

    if (subNode.getData('region') === node.getData('region') 
            && !subNode.hasClass('selectorButton')) {
        subNode.addClass('preOptionSelect');
    }
    

    but what you have there is reasonably idiomatic YUI3, so if it works, go with it!