Okay I have gone back to a single DataTable to try and get this to work, after reading many community threads and documents. It would appear this was reported as a bug back in 2019 and I believe it still exists!?
DataTable on a public form:
Clicking submit with no rows added with validation check results are correct
Making the first three columns required and prepopulating the last two column rows with a hyphen means that each time a record is added the first columns is always in focus and the required error displays when clicking any other row field.
However you can still skip column 2 and 3 even though they are mark required in the designer, if you do not click in the respective row you can submit the form successfully.
If we then add the code to validate all fields
fd.control('DataTable2').addValidator({
name: 'DataTable validator',
error: "Fill out all required column fields.",
validate: function(value){
for(var i = 0; i < value.length; i++){
if(!value[i].Column1 || !value[i].Column2){
return false;
}
}
return true;
}})
It will show the error, but even though all the row fields are populated it will not submit the form.
Submission with all fields populate which includes the prepopulated hyphens in column 4 and 5
Even making sure the last two columns are selected by the user, the results are the same.
Using an in private browser and ensuring one row is completed by selecting a drop-down value for each column row field gives the same result.
Regards
Mark
fd.rendered(function() {
//select the Data Table control to automatically prepopulate new rows
var dt = fd.control('DataTable2');
var isNew = false;
dt.widget.wrapper.find('.k-grid-add').on('click', e => {
isNew = true;
});
dt.widget.bind('edit', function(e) {
if (isNew) {
isNew = false;
//set values for Column4 and Column5
e.model.set('CurrentYear11Grade', '-');
e.model.set('ActualGrade', '-');
}
});
// Validate at least one record on a Data Table
fd.control('DataTable2').addValidator({
name: 'DataTable1 validator',
error: 'Error message',
validate: function(value) {
if (value.length == 0) {
this.error = "Add at least one record to the Student Qualification table by clicking the '+ Add new record' button.";
return false;
}
return true;
}
});
fd.control('DataTable2').addValidator({
name: 'DataTable validator',
error: "Fill out all required column fields.",
validate: function(value){
for(var i = 0; i < value.length; i++){
if(!value[i].Column1 || !value[i].Column2){
return false;
}
}
return true;
}})
});