I've met some issues by retrieving checkboxes from an array of values.
I tried to auto check the checkboxes which are concerned by an array.
array[i] generate some input of checkboxes target[i] is an array which contains some checkboxe's values. So when I refresh the page, I have to see that "tuesday" and "Wendesday" is already selected. cf.the snippet (I don't know if I explain correctly)
// table which generate checkboxes
var array = new Array();
array[0]="Monday";
array[1]="Tuesday";
array[2]="Wendesday";
array[3]="Thirsday";
array[4]="Friday";
array[5]="Saturday";
array[6]="Sunday";
// values to of checkboxes I want to auto-check
var target = new Array();
target[0]="Tuesday";
target[1]="Wendesday";
var cbh = document.getElementById('checkboxes');
var val = '';
var cap = "";
var j = "";
for (var i in array) {
//Name of checkboxes are their number so I convert the i into a string.
j = i.toString();
val = j;
//cap will be the value/text of array[i]
var cb = document.createElement('input');
var label= document.createElement("label");
cap = array[i];
var text = document.createTextNode(cap);
cb.type = 'checkbox';
cbh.appendChild(cb);
cb.name = cap;
cb.value = val;
label.appendChild(cb);
label.appendChild(text);
cbh.appendChild(label);
}
* {
box-sizing: border-box;
}
#data {
padding:5px;
width:100vw;
}
.multiselect {
overflow: visible;
padding:0;
padding-left:1px;
border:none;
background-color:#eee;
width:100vw;
white-space: normal;
height:50px;
}
.checkboxes {
height:100px;
width:100px;
border:1px solid #000;
background-color:white;
margin-left:-1px;
display:inline-block;
}
label {
display: inline-block;
border: 1px grey solid;
padding:5px;
}
<form>
<div id="data">
<div class="multiselect">
<div id="c_b">
<div id="checkboxes">
</div>
</div>
</div>
</div>
</form>
Tuesday and Wendesday have to be automitacly checked
Thank you for your help. Regards
Aucun commentaire:
Enregistrer un commentaire