I have code that works fine in FF, but not in IE. Certain values are hidden in the second drop, depending on the value of the selected first drop-down list. The values are hidden correctly in FF, but everything is displayed in IE:
function updateMountingMethod() { var selectedVal = $('#attrib-13 option:selected').text().split(" ")[0]; $.each($("#attrib-7").children(), function() { var optionText = $(this).text(); var values = optionText.split('|')[1]; if (values != undefined) { if (values.substring(1, 3) != selectedVal) { $(this).css('display', 'none'); } else { $(this).text($(this).text().split("|")[0] + $(this).text().split("|")[2]); } } }) }
If this is not entirely clear, this is the best description.
I have jQuery code that gets called every time the drop down value changes. When the value changes, it gets the size of the selected item. The displayed values look like 11 feet, 15 feet, 19 feet, so I broke them just to get a number, not a foot. Depending on the selected value, you need to update the following drop-down menu that follows this format:
Item 1 | 11'11 "|
Item 2 | 15'9 "|
Item 3 | 19'9 "|
...
I do not want stuff between | | | | displayed, it just needs to correspond to each element with the selected length (for example, the 11 feet option is selected in the first drop-down list, then only the 11'11" option is displayed in the second drop-down list). Can someone tell me why these additional values are not hiding in IE?
source share