So i am trying to create a mobile website with jquery mobile. I have a fieldset with multiple checkboxes like this. The user has to check all of those checkboxes in order to proceed. That works fine so far.
<div>
<fieldset id="checkBoxContainer" data-role="controlgroup" data-type="vertical">
<input name="CheckBoxGroup" class="CheckBox" id="CheckBox_1" type="checkbox">
<label for="CheckBox_1">The first Checkbox</label>
<input name="CheckBoxGroup" class="CheckBox" id="CheckBox_2" type="checkbox">
<label for="CheckBox_2">The secondCheckbox</label>
<input name="CheckBoxGroup" class="CheckBox" id="CheckBox_3" type="checkbox">
<label for="CheckBox_3">The third Checkbox</label>
</fieldset>
</div>
Now i wanted to dynamically create those text checkboxes with something like that:
function createCheckBox(theClass, theId) {
$('#checkBoxContainer').controlgroup("container").append('<label for='
theId '><input type="checkbox" class='
theClass ' name="clock-place" "id='
theId ' />Checkbox</label>');
$("#checkBoxContainer").enhanceWithin().controlgroup("refresh");
}
But somehow how i cant set the ID and the class based on the Parameter for the input and label element what am i doing wrong how can i do it?
The second question is then how would I check if those dynamically added checkboxes are checked I need the Id somehow dont i how do i solve this problem?
Currently i am checking them like that:
function controlCheckBoxStatus() {
$("input.CheckBox").on("change", function() {
if ($("input#CheckBox_1").is(":checked") &&
($("input#CheckBox_2").is(":checked")) &&
($("input#CheckBox_3").is(":checked"))) {
checkBoxStatus = true;
alert("All checkboxes checked!");
} else {
checkBoxStatus = false;
}
})
}
Aucun commentaire:
Enregistrer un commentaire