If I'm using unobtrusive AJAX and my ID's contain special characters, like a dot or a colon, which is perfectly valid, it breaks and cannot find the referenced elements. In AjaxOptions, you have this code (and also for the loading element):
result.Add("data-ajax-update", "#" + UpdateTargetId);
And then in jquery.unobtrusive-ajax.js, you do this (among other similar uses):
$(update).html(data);
If my ID contains a dot, it ends up doing this:
$("#a.b").html(data);
And it won't find the element named "a.b", but will instead look for an element named "a" having a class of "b".
Solution: you have to correctly escape those ID's, so that you end up doing this:
$("#a\\.b").html(data);
jQuery documentation: http://learn.jquery.com/using-jquery-core/faq/how-do-i-select-an-element-by-an-id-that-has-characters-used-in-css-notation/
Note that they say you have to escape dots and colons, but the example also escapes square brackets, I don't think those are valid in ID's. I also filed a feature request to them about providing a function to do the proper escaping (http://bugs.jquery.com/ticket/14692), but I guess that's not relevant here if you want to stay compatible with current versions.
And just a side note: AjaxOptions doesn't support multiple target ID's, but the JS side does. It's not a problem actually, just makes me wonder if it was intended.
Comments: According to the HTML5 specs - http://www.w3.org/html/wg/drafts/html/master/dom.html#the-id-attribute the only restriction seems to be that ids cannot contain space characters. So sqaure brackets should be perfectly acceptable.
result.Add("data-ajax-update", "#" + UpdateTargetId);
And then in jquery.unobtrusive-ajax.js, you do this (among other similar uses):
$(update).html(data);
If my ID contains a dot, it ends up doing this:
$("#a.b").html(data);
And it won't find the element named "a.b", but will instead look for an element named "a" having a class of "b".
Solution: you have to correctly escape those ID's, so that you end up doing this:
$("#a\\.b").html(data);
jQuery documentation: http://learn.jquery.com/using-jquery-core/faq/how-do-i-select-an-element-by-an-id-that-has-characters-used-in-css-notation/
Note that they say you have to escape dots and colons, but the example also escapes square brackets, I don't think those are valid in ID's. I also filed a feature request to them about providing a function to do the proper escaping (http://bugs.jquery.com/ticket/14692), but I guess that's not relevant here if you want to stay compatible with current versions.
And just a side note: AjaxOptions doesn't support multiple target ID's, but the JS side does. It's not a problem actually, just makes me wonder if it was intended.
Comments: According to the HTML5 specs - http://www.w3.org/html/wg/drafts/html/master/dom.html#the-id-attribute the only restriction seems to be that ids cannot contain space characters. So sqaure brackets should be perfectly acceptable.