Still getting to grips with jQuery and I am pleased to have got as far as I have, especially help from the posts in this forum. However, now got to a working function that does what I want, that is to create a radio group that looks like a button. It pulls data via json and loops through creating the radio buttons.
I want to get the id of the radio buttons generated so that I can then parse through to the next step of the app but I can't get it to work.
function FillDiv(groups, side) {
var cnt = 1;
var newClass = '';
var newType = '';
if (side == '#ck-button-left') {
newClass = 'leftClass';
newType = 'radio'
}
else {
newClass = 'rightClass';
newType = 'checkbox'
}
$.each(groups, function (index, groups) {
$(side)
.append(
$(document.createElement('label')).attr({
id: cnt + 'lbl'
})
);
$('#' + cnt + 'lbl')
.append(
$(document.createElement('input')).attr({
id: groups.GroupCode,
type: newType,
name: 'testGroup',
class: newClass
})
);
$('#' + groups.GroupCode).after
(
$(document.createElement('span')).text(groups.GroupName).attr('class', 'leftSpan')
);
$('#' + cnt + 'lbl').after($(document.createElement('br')));
cnt = cnt + 1;
});
}
Looking through various searched, it should work with something like...
$('#leftSpan').mouseover(function () {
$('#lblOutput').html(this.id);
});
or, as I suspect, it is something to do with the nesting of the label/input that I need to reference the parent or child.
Any pointers would be appreciated.
