Props for prop
by Dominic Myers
HTML
<div id="input-holder"></div>
<div id="select-holder-01"></div>
<div id="select-holder-02"></div>
JavaScript
var contravention = false;
var selects = ["one", "two", "three"];
var selected_01 = "two";
var selected_02 = ["one", "three"];
$("#input-holder")
.append($("<div></div>",{
"id": "contravention"})
.append($("<label></label>",{
"for": "contravention",
"text": "Contravention"
}))
.append($("<input/>",{
"id":"contravention",
"name":"contravention",
"type":"checkbox",
"value": "true"
}).prop("checked", contravention)
));
$("#select-holder-01")
.append($("<div></div>",{
"id": "select"})
.append($("<label></label>",{
"for": "selects",
"text": "Selects"
}))
.append($("<select></select>",{
"id":"selects",
"name":"selects"
}).append(function(){
var options = [$("<option></option>",{
"value":"",
"text":"Please Choose"
})];
$.each(selects, function(k, v){
options.push($("<option></option>",{
"value": v,
"text": v
}).prop("selected", v === selected_01))
})
return options;
})
));
$("#select-holder-02")
.append($("<div></div>",{
"id": "select"})
.append($("<label></label>",{
"for": "selects",
"text": "Selects"
}))
.append($("<select></select>",{
"id":"selects",
"name":"selects",
"multiple":"multiple"
}).append(function(){
var options = [$("<option></option>",{
"value":"",
"text":"Please Choose"
})];
$.each(selects, function(k, v){
options.push($("<option></option>",{
"value": v,
"text": v
}).prop("selected", $.inArray(v, selected_02) + 1))
})
...