javascript - DevExtreme DataGrid OnRowClick - Stack Overflow

admin管理员组

文章数量:1347670

I'm using a DevExtreme Data Grid inside a master-detail view. I want to open another component (or section) when a row is clicked inside the detail grid. To do this, I'm setting a variable (showAddHorario = true) inside the onRowClick event. However, it doesn't always work on the first click—it sometimes requires multiple clicks before the state updates.

Here’s the relevant code:

  [dataSource]="salas"
  [showColumnLines]="true"
  [showBorders]="true"
  [rowAlternationEnabled]="true"
  [focusedRowEnabled]="false"
  [selection]="{ mode: 'none' }"
  [masterDetail]="{ enabled: true, autoExpandAll: true, template: 'detailTemplate' }">

//rest of code

  </div>
  <div *dxTemplate="let data of 'detailTemplate'">
    <dx-data-grid
      [dataSource]="data.data.horarios"
      [showBorders]="true"
      [hoverStateEnabled]="true"
      [selection]="{ mode: 'none' }"
      [focusedRowEnabled]="false"
      keyExpr="id"
      (onRowClick)="onRowClick($event, data.data)"
      class="detail-grid">
      <dxi-column dataField="startDate" caption="{{ label.DataInicio }}" [format]="{ type: 'date', format: 'dd/MM/yyyy' }"></dxi-column>
      <dxi-column dataField="endDate" caption="{{ label.DataFim }}" [format]="{ type: 'date', format: 'dd/MM/yyyy' }"></dxi-column>

      @for (day of daysOfWeek; track $index; let dayIndex = $index) {
        <dxi-column [caption]="day" [calculateCellValue]="getScheduleCalculator(dayIndex)"></dxi-column>
      }
    </dx-data-grid>
  </div>

heres the function called:

onRowClick(event: RowClickEvent, sala: GetSalasByServiceResponse): void {
    const horario: GetSalasByServicoHorarioResponse = event.data;
    const horarioData: GetSalaByServicoHorarioDiarioResponse[] = event.data.horariosDiarios || [];
    this.selectedHorarioData = horario;
    this.horariosDiarios = horarioData;
    this.selectedSala = sala;
    this.showAddHorario = true;
  }

本文标签： javascriptDevExtreme DataGrid OnRowClickStack Overflow