config to html !
by bilbobaggins
HTML
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.min.js"></script>
<div id="dvcontent">
</div>
JavaScript
var htmlselcontrol={
searchparams:[],
singleonload:function(element)
{
var selid="sel_"+element.inputname;
var div = $("<select id="+selid+" style=\"width:260px\" ><option>");
$("#dvcontent").append(div);
$("#"+selid+"").select2({
placeholder: element.inputplaceholder,
allowClear: true,
data:element.childcontent,
}).on('change', function (e) {
var theSelection = $("#"+selid+"").select2('data')
var internobj={}
internobj.field=selid
internobj.val=theSelection[0].id
var doctors = htmlselcontrol.searchparams.filter(function(doctor) {
return doctor.field === internobj.field; // if truthy then keep item
})
var doc =htmlselcontrol.searchparams.findIndex(function(doctor) {
return doctor.field === internobj.field; // if truthy then keep item
})
console.log(doc)
if(doc>=0)
{
htmlselcontrol.searchparams[doc].val=internobj.val
}
else
{
htmlselcontrol.searchparams.push(internobj)
//htmlselcontrol.searchparams.push(internobj)
}
console.log(htmlselcontrol.searchparams)
});
},
}
//var eee= res.filter(day => result.some(obj => obj.field === day.field))
// console.log(eee)
// console.log(eee)
var redlime=[
{
"inputtype": "singleselect",
"inputname": "singleinp",
"inputplaceholder": "please enter first",
"fieldtypename": "STRING",
"fieldvalidatename": "string",
"fieldmaxlength": "80",
"childcontent": [
{
"id": "1",
"text": "red"
},
{
"id": "2",
"text": "lime"
}, {
"id": "3",
"text": "sascaras"
}]
},
{
"inputtype": "singleselect",
"inputname": "singleinpsel",
"inputplaceholder": "please enter second ",
"fieldtypename": "STRING",
"fieldvalidatename": "string",
"fieldmaxlength": "80",
"childcontent": [
{
"id": "1",
"text": "red1111"
},
{
"id": "2",
"text": "lime111111"
}]
},
{
"inputtype":...