My customer base is highly IE8 and 7, so bear with me.
I have objects on page that represent a hierarchy–think orders/line-items type structure. An object on the page is
<input type="text" name="Orders[0].LineItems[1]_lineItemTotal" />
I’m seeing an issue where, in IE7 only, this selector will not work:
var total = $('[name="Orders[0].LineItems[1]_lineItemTotal"]').val();
Tracking this down, it appears that if we escape the period, we can make this work:
var total = $('[name="Orders[0]\\.LineItems[1]_lineItemTotal"]').val();
The thing that’s causing me concern is that it doesn’t seem to be the period itself causing the problem, as this works just fine:
var orderId = $('[name="Orders[0].OrderId"]');
Anyone have any insight as to what’s going on, or the best way to approach this? I’m pretty heavily invested in the naming scheme of the HTML elements, and this only came to light when QA testing against IE7–Chrome, IE9, IE8, etc seem to deal with this just fine.
I’m using jQuery 1.7.1.
To make things even weirder, it looks like a name of Orders[0].1_lineItemTotal works just fine, but as soon as you put any non-special character after that period, it stops working!
I think the backslashes are the best approach for now.
The jQuery Documentation provides some information about escaping characters in CSS selectors, but it shouldn’t have to apply here where you’re setting an attribute.