grid.colsNumber|Array
A number defines the columns of the grid. When an array is used it is used to map the columns to the provided responsive breakpoints.
Example - setting columns to number
<form id="myForm"></form>
<script>
$("#myForm").kendoForm({
formData: {
ID: 1,
Name: "Ivan",
Address: "Sofia"
},
layout: "grid",
grid: {
cols: 2,
gutter: 10,
rows: 1
},
items: [{
field: "Name",
label: "Name:"
}, {
field: "Address",
label: "Address:"
}]
});
</script>Example - setting columns to an array
<form id="myForm"></form>
<script>
$("#myForm").kendoForm({
formData: {
ID: 1,
Name: "Ivan",
Address: "Sofia"
},
layout: "grid",
grid: {
cols: [{
maxWidth: 600,
value: 2
},
{
minWidth: 601,
maxWidth: 800,
value: 3
},
{
minWidth: 801,
maxWidth: 2800,
value: 4
}],
gutter: 10,
rows: 1
},
items: [{
field: "Name",
label: "Name:"
}, {
field: "Address",
label: "Address:"
}]
});
</script>In this article