Jquery $ function returns different results in IE

$('.Schedule .Full input').each(function(i)
 {
        var controls = $('.Morning input, .MorningPart input, .Afternoon input, .AfternoonPart input', $(this).parents('.Schedule'));
        alert(controls.length + " Conflicting Controls\n"+
              $(this).parents('.Schedule').attr('id') + " Parent");
 });

      

When I run this code in Firefox, the first execution of this function creates an alert box with the following content:

17 Conflicting
Monday parent controls

The exact same page launched in IE 6 or 7 generates an alert box that says this:

45 Conflicting
Monday parent controls

Firefox is right, there are only 17 conflicting controls. 45 that IE identifies are controls that are not descendants of Monday. If I set "Monday" as the context for the $ () function, why does IE return controls outside of it?

+1


a source to share


3 answers


Try



var controls = $(this).parents('.Schedule').children('.Morning input, .MorningPart input, .Afternoon input, .AfternoonPart input')

      

+1


a source


I modified your example slightly because my structure is slightly different

$(this).parents('.RadioSchedule').children('.Morning, .MorningPart, .Afternoon, .AfternoonPart').find('input');

      



this worked, getting the same results in IE and Firefox

+1


a source


<div id="Monday" class="Schedule">
    <div class="Full">
        <div>
            <input type="radio" name="MondayFullDay" checked="checked" value="none"/>None 
        </div>
    </div>
</div>
<div id="Tuesday" class="Schedule">
    <div class="Full">
        <div>
            <input type="radio" name="TuesdayFullDay" checked="checked" value="none"/>None 
        </div>
    </div>
</div>

      

Okay, here's another tricky part ... Looks like

$(this).parents('.Schedule');

      

returns step-by-step results as they run. So when it is executed the first time for MondayFullDay it returns 1 result, but as soon as it gets to TuesdayFullDay it returns 2 results. This is IE only.

Since the above xhtml structure is not optional for this application, I ended up just manually moving the DOM through successive calls to .parent ().

Changing this

$(this).parents('.Schedule'); 

      

In that

$(this).parent().parent().parent();

      

I'm still convinced that the parents () method doesn't work as documented, though ...

+1


a source







All Articles