Light-Weight, High-Performance & Easily Customizable
Control for list of items with same data structure and as the default control mapped to array
data type.
List of supported JSON schema keywords.
List of supported LittleCub config options.
Array control with only array data parameter.
var arrayControl1 = LittleCub(["Giant Panda","Brown Bear","Polar Bear","Blue Bear"], null, null, document.getElementById('array-control-1'));
var arrayControl1j = $('#array-control-1-j').lc(["Giant Panda","Brown Bear","Polar Bear","Blue Bear"]);
Array control with data and schema parameters.
var arrayControl2 = LittleCub(["Giant Panda","Brown Bear","Polar Bear","Blue Bear"], null, {
"type" : "array",
"title" : "Bears",
"items" : {
"type" : "string",
"title" : "Your Favorite Bear"
}
}, document.getElementById('array-control-2'));
var arrayControl2j = $('#array-control-2-j').lc(["Giant Panda","Brown Bear","Polar Bear","Blue Bear"], null, {
"type" : "array",
"title" : "Bears",
"items" : {
"type" : "string",
"title" : "Your Favorite Bear"
}
});
Array control with data, configs and schema parameters.
var arrayControl3 = LittleCub(["Giant Panda","Brown Bear","Polar Bear","Blue Bear"], {
"type" : "array",
"items" : {
"size" : 10
}
}, {
"type" : "array",
"title" : "Bears",
"minItems" : 2,
"maxItems" : 5,
"uniqueItems" : true,
"items" : {
"type" : "string",
"title" : "Your Favorite Bear"
}
}, document.getElementById('array-control-3'));
var arrayControl3j = $('#array-control-3-j').lc(["Giant Panda","Brown Bear","Polar Bear","Blue Bear"], {
"type" : "array",
"items" : {
"size" : 10
}
}, {
"type" : "array",
"title" : "Bears",
"minItems" : 2,
"maxItems" : 5,
"uniqueItems" : true,
"items" : {
"type" : "string",
"title" : "Your Favorite Bear"
}
});
Array control with configs and schema parameters that have various options.
var arrayControl4 = LittleCub([], {
"type" : "array",
"items" : {
"type" : "object",
"controls" : {
"name" : {
"type" : "text",
"size" : 30
},
"color" : {
"type" : "select"
}
}
}
}, {
"type" : "array",
"title" : "Bears",
"minItems" : 2,
"maxItems" : 5,
"uniqueItems" : true,
"items" : {
"type" : "object",
"properties" : {
"name" : {
"type" : "string"
},
"color" : {
"type" : "string",
"enum" : ["brown", "white", "grey","black"]
}
},
"required" : ["name", "color"]
}
}, document.getElementById('array-control-4'));
var arrayControl4j = $('#array-control-4-j').lc([], {
"type" : "array",
"items" : {
"type" : "object",
"controls" : {
"name" : {
"type" : "text",
"size" : 30
},
"color" : {
"type" : "select"
}
}
}
}, {
"type" : "array",
"title" : "Bears",
"minItems" : 2,
"maxItems" : 5,
"uniqueItems" : true,
"items" : {
"type" : "object",
"properties" : {
"name" : {
"type" : "string"
},
"color" : {
"type" : "string",
"enum" : ["brown", "white", "grey","black"]
}
},
"required" : ["name", "color"]
}
});