Reputation: 10237
I have a dynamically-created control which I gave the ID "ckbxEmp"
As I discovered by "Viewing Source," Sharepoint (or Chrome, or "somebody") impertinently and presumptuously re-Ids (and names it, and "for"s it) this control, giving it the Welsh-esque "ctl00_ctl24_g_1caf4ad1_092d_4224_bd10_28ab028aab50_ctl00_ckbxEmp"
And so (I assume this is the reason), all attempts to manipulate "ckbxEmp" via jQuery fail - that is to say, when I look for the short ID I gave it, like so:
$(document).on("change", '#ckbxEmp', function () {
console.log('Function has been reached');
if ($(this).is(":checked")) {
alert("Checked");
} else {
alert("Not checked");
}
});
So I can either change that code to this:
$(document).on("change", '#ctl00_ctl24_g_1caf4ad1_092d_4224_bd10_28ab028aab50_ctl00_ckbxEmp', function () {
console.log('Function has been reached');
if ($(this).is(":checked")) {
alert("Checked");
} else {
alert("Not checked");
}
});
...which would be okay as a one-time thing, but I have many dynamically-created controls that I will want to manipulate, and I assume they will all be Welshified, and this will be a bit of a pain.
-OR, hopefully there is a way to look for ID matches that are not exact but "ends with". Is that possible? If so, what is the syntax for that?
Note: This is a followup to this question.
Bizarrely enough (this is starting to get really irritating), this doesn't work, either:
$(document).on("change", '#ctl00_ctl24_g_1caf4ad1_092d_4224_bd10_28ab028aab50_ctl00_ckbxEmp', function () {
console.log('Function has been reached');
if ($(this).is(":checked")) {
alert("Checked");
} else {
alert("Not checked");
}
});
Robert McKee's answer, plus the one from the question to which this is a follow-up, have led to a working solution, codely:
$(document).on("change", '[id$=ckbxEmp]', function () {
alert('Function has been reached');
if ($(this).is(":checked")) {
alert("Checked");
} else {
alert("Not checked");
}
});
"This is this. This ain't something else. This is this." - the Deer Hunter
Upvotes: 0
Views: 36
Reputation: 126
Use Jquery selector
To get all the elements starting with "ckbxEmp" you should use:
$(document).on("change", "[id^='ckbxEmp']", function () {
To get those that end with "ckbxEmp"
$(document).on("change", "[id$='ckbxEmp']", function () {
Upvotes: 1