I have the following form that I have been battling with for some time and cannot figure out why the data is not displaying.
The form renders the correct number of array elements, but the values are not displayed.
Any hint or suggestion on how to try and fix it would be greatly appreciated.
Thanks.
<!DOCTYPE HTML>
<html>
<head>
<title>Flow1Input2Parameter Form</title>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css">
<link type="text/css" rel="stylesheet" href="http://code.cloudcms.com/alpaca/1.5.23/bootstrap/alpaca.min.css">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.5/handlebars.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="http://code.cloudcms.com/alpaca/1.5.23/bootstrap/alpaca.min.js"></script>
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.14.30/js/bootstrap-datetimepicker.min.js"></script>
<style>
body {
-moz-transform: scale(0.75, 0.75); /* Moz-browsers */
zoom: 0.75; /* Other non-webkit browsers */
zoom: 75%; /* Webkit browsers */
}
</style>
</head>
<body>
<div class="container" style="margin-top:30px">
<div class="row">
<div class="col-md-12">
<div id="field1"></div>
</div>
</div>
</div>
<script type="text/javascript">
Alpaca.logLevel = Alpaca.DEBUG;
$(document).ready(function() {
$("#field1").alpaca({
"view": "bootstrap-create",
"data": '{ "strs" : [ "a", "b", "c", "d" ]}',
"schema" : {
"title" : "Object",
"type" : "object",
"properties" : {
"strs" : {
"title" : "Integers3",
"type": "array",
"items" : {
"type": "string"
}
}
}
},
"options" : {
"fields" : {
"strs" : {
"fields" : {
"item" : {
"size" : 5
}
}
}
},
"form" : {
}
}
});
});
</script>
</body>
</html>