invalidate form if grid doesn't have rows - DevExtreme grid - Angular

Question

how to make a form invalid if a grid(DxDataGridModule) of DevExtreme framework doesn't have any row?

the grid is in row editing mode so the status of the myFormVariable.form.valid should change if i add or remove rows to the grid

<form  #myFormVariable="ngForm" id="frm_create_user" novalidate (ngSubmit)="save()">
.....
...
</form>

At what point do you check for validity of form. – Robert Feb 16 '18 at 11:15 — Robert, Feb 16 '18 at 11:15

score 0 · Answer 1 · answered Feb 16 '18 at 17:24

I presume this save() method is called after the form was deemed valid. In this method simpy check if the grid is empty and report an error to the user.

function save(){
   var gridData = $("#grid").dxDataGrid().dxDataGrid("instance").option("dataSource");
   if(gridData == null || gridData.length == 0)
   {
      //Report the error to the user
      return;
   }
   //Code that issues a request to the server
}

I made a quick example on CodePen. I have copied the example from here and adjusted it so a grid is also present. This is just to give you a general idea of how to do.

invalidate form if grid doesn't have rows - DevExtreme grid - Angular

1 Answers1