syncfusion_flutter_datagrid NoSuchMethodError

[thisadee2897]

Bug description

NoSuchMethodError: method not found: 'aC' (p.aC is not a function) js_primitives.dart:28 at aE6.$1 (http://localhost:63310/oho-hero-uat/main.dart.js:125800:51) js_primitives.dart:28 at a0.dA (http://localhost:63310/oho-hero-uat/main.dart.js:51418:23) js_primitives.dart:28 at bS.D (http://localhost:63310/oho-hero-uat/main.dart.js:51398:16) js_primitives.dart:28 at Object.bEk (http://localhost:63310/oho-hero-uat/main.dart.js:5891:17) js_primitives.dart:28 at Object.ad (http://localhost:63310/oho-hero-uat/main.dart.js:5885:15) js_primitives.dart:28 at a54.CM (http://localhost:63310/oho-hero-uat/main.dart.js:125780:19) js_primitives.dart:28 at Object.brT (http://localhost:63310/oho-hero-uat/main.dart.js:38837:5) js_primitives.dart:28 at aTp.Rs (http://localhost:63310/oho-hero-uat/main.dart.js:142008:8) js_primitives.dart:28 at aTp.Rr (http://localhost:63310/oho-hero-uat/main.dart.js:142022:21) js_primitives.dart:28 at aTp.b4H (http://localhost:63310/oho-hero-uat/main.dart.js:141945:14)

Steps to reproduce

class HistoryEmissionScreen extends BaseStatefulWidget {
  const HistoryEmissionScreen({super.key});

  @override
  // ignore: library_private_types_in_public_api
  _AccountSecurityScreenState createState() => _AccountSecurityScreenState();
}

class _AccountSecurityScreenState extends BaseState<HistoryEmissionScreen> {
  TextEditingController textSearch = TextEditingController();

  @override
  Widget buildDesktop(BuildContext context, SizingInformation sizingInformation) {
    return content(
      buildDesktop: true,
    );
  }

  @override
  Widget? buildTablet(BuildContext context, SizingInformation sizingInformation) {
    return content();
  }

  @override
  Widget buildMobile(BuildContext context, SizingInformation sizingInformation) {
    return content();
  }

  @override
  @override
  void initState() {
    super.initState();
    WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
      ref.read(emissionHistoryProvider.notifier).read();
    });
  }

  Widget content({bool buildDesktop = false}) {
    var state = ref.watch(emissionHistoryProvider);
    var getData = ref.watch(emissionHistoryData);
    return SafeArea(
      top: true,
      bottom: false,
      child: Stack(
        children: [
          BackGroundEmission(),
          Center(
            child: SizedBox(
              width: buildDesktop ? 1800 : null,
              child: Column(
                children: [
                  _title(),
                  Align(
                    alignment: Alignment.centerLeft,
                    child: ButtonCustom(
                      icons: Icons.add_circle,
                      text: 'Add',
                      onTap: () {
                        // var user = ref.watch(localStorageServiceProvider);
                        var url = GoRouter.of(context).state!.uri;
                        String path = Routes.dataCollectionPeriod;
                        String currentPath = url.path;
                        String idEmission = idToBase64(id: '0');
                        GoRouter.of(context).go(Uri(
                          path: "$currentPath/$path",
                          queryParameters: {'emission': idEmission},
                        ).toString());
                      },
                    ),
                  ),
                  Expanded(
                    child: Padding(
                      padding: const EdgeInsets.only(top: 8, bottom: 30),
                      child: Container(
                        decoration: _decoration(),
                        child: state.when(
                          data: (_) {
                            if (getData.emissionData.isEmpty) {
                              return Center(child: Text('ไม่มีข้อมูล'));
                            }
                            return _tableUI(getData);
                          },
                          loading: () => Center(child: iOSLoadding()),
                          error: (err, stack) => Center(child: Text('เกิดข้อผิดพลาด: ${err.toString()}')),
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  BoxDecoration _decoration() {
    return BoxDecoration(
      color: CupertinoColors.white.withOpacity(0.9),
      borderRadius: BorderRadius.circular(20),
      boxShadow: [
        BoxShadow(
          color: CupertinoColors.systemGrey.withOpacity(0.3),
          blurRadius: 5,
          offset: Offset(0, 3),
        ),
      ],
    );
  }

  Align _title() {
    return Align(
      alignment: Alignment.centerLeft,
      child: Padding(
        padding: EdgeInsets.only(top: 24, left: 8, bottom: 16),
        child: Text(
          showText(
            ref: ref,
            TH: 'บันทึกการก่อเกิดการปล่อยก๊าซเรือนกระจก',
            EN: 'Record of Greenhouse Gas Emissions',
          ),
          style: CupertinoTheme.of(context).textTheme.navLargeTitleTextStyle,
        ),
      ),
    );
  }

  _tableUI(EmissionHistoryData getData) {
    return SfDataGridTheme(
      data: SfDataGridThemeData(
        headerColor: CustomColors.primaryColor.withOpacity(0.2),
        headerHoverColor: CustomColors.primaryColor.withOpacity(0.3),
      ),
      child: ClipRRect(
        borderRadius: BorderRadius.circular(20),
        child: SfDataGrid(
          gridLinesVisibility: GridLinesVisibility.none,
          headerGridLinesVisibility: GridLinesVisibility.none,
          columnWidthMode: ColumnWidthMode.fill,
          source: EmissionDataSourceScopeAll(emissionData: getData.emissionData, context: context),
          columns: <GridColumn>[
            GridColumn(
              columnName: 'branch',
              width: double.nan,
              label: Container(
                alignment: Alignment.centerLeft,
                padding: const EdgeInsets.all(8.0),
                child: Text(
                  showText(ref: ref, TH: 'สาขา', EN: 'Branch'),
                  // style: textStyle,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ),
            GridColumn(
              columnName: 'DocumentNo',
              width: 200,
              label: Container(
                alignment: Alignment.centerLeft,
                padding: const EdgeInsets.all(8.0),
                child: Text(
                  showText(ref: ref, TH: 'เลขที่การปล่อย', EN: 'Document No.'),
                  // style: textStyle,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ),
            GridColumn(
              columnName: 'docudate',
              width: 200,
              label: Container(
                alignment: Alignment.centerLeft,
                padding: const EdgeInsets.all(8.0),
                child: Text(
                  showText(ref: ref, TH: 'ระยะเวลาเก็บข้อมูล', EN: 'Document Date'),
                  // style: textStyle,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ),
            GridColumn(
              columnName: 'scope1',
              width: 100,
              label: Container(
                alignment: Alignment.centerRight,
                padding: const EdgeInsets.all(8.0),
                child: const Text(
                  'ขอบข่าย1',
                  // style: textStyle,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ),
            GridColumn(
              columnName: 'scope2',
              width: 100,
              label: Container(
                alignment: Alignment.centerRight,
                padding: const EdgeInsets.all(8.0),
                child: const Text(
                  'ขอบข่าย2',
                  // style: textStyle,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ),
            GridColumn(
              columnName: 'scope3',
              width: 100,
              label: Container(
                alignment: Alignment.centerRight,
                padding: const EdgeInsets.all(8.0),
                child: Text(
                  showText(ref: ref, TH: 'ขอบข่าย3', EN: 'Scope 3'),
                  // style: textStyle,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ),
            GridColumn(
              columnName: 'Comparewith',
              width: 150,
              label: Container(
                alignment: Alignment.centerLeft,
                padding: const EdgeInsets.all(8.0),
                child: Text(
                  showText(ref: ref, TH: 'เปรียบเทียบกับ', EN: 'Compare with'),
                  // style: textStyle,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ),
            GridColumn(
              columnName: 'Production',
              width: 120,
              label: Container(
                alignment: Alignment.centerRight,
                padding: const EdgeInsets.all(8.0),
                child: Text(
                  showText(ref: ref, TH: 'ปริมาณการผลิต', EN: 'Production'),
                  // style: textStyle,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ),
            GridColumn(
              columnName: 'Unit',
              width: 100,
              label: Container(
                alignment: Alignment.centerLeft,
                padding: const EdgeInsets.all(8.0),
                child: Text(
                  showText(ref: ref, TH: 'หน่วย', EN: 'Unit'),
                  // style: textStyle,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ),
            GridColumn(
              columnName: 'CompareProduction',
              width: 150,
              label: Container(
                alignment: Alignment.centerRight,
                padding: const EdgeInsets.all(8.0),
                child: Text(
                  showText(ref: ref, TH: 'ปริมาณการเปรียบเทียบ', EN: 'Compare Production'),
                  // style: textStyle,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ),
            GridColumn(
              columnName: 'Status',
              width: 100,
              label: Container(
                alignment: Alignment.center,
                padding: const EdgeInsets.all(8.0),
                child: Text(
                  showText(ref: ref, TH: 'สถานะ', EN: 'Status'),
                  // style: textStyle,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ),
            GridColumn(
              columnName: 'Open/Edit',
              width: 80,
              label: Container(
                alignment: Alignment.center,
                padding: const EdgeInsets.all(8.0),
                child: Text(
                  showText(ref: ref, TH: 'เปิด/แก้ไข', EN: 'Open/Edit'),
                  // style: textStyle,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class EmissionDataSourceScopeAll extends DataGridSource {
  EmissionDataSourceScopeAll({required List<EmissionData> emissionData, required BuildContext context}) {
    dataGridRow = emissionData
        .map<DataGridRow>(
          (data) => DataGridRow(
            cells: [
              DataGridCell<String>(columnName: 'branch', value: data.branch),
              DataGridCell<String>(columnName: 'DocumentNo', value: data.documentNo),
              DataGridCell<String>(columnName: 'docudate', value: data.docudate),
              DataGridCell<num>(columnName: 'scope1', value: data.scope1),
              DataGridCell<num>(columnName: 'scope2', value: data.scope2),
              DataGridCell<num>(columnName: 'scope3', value: data.scope3),
              DataGridCell<String>(columnName: 'Comparewith', value: data.comparewith),
              DataGridCell<num>(columnName: 'Production', value: data.production),
              DataGridCell<String>(columnName: 'Unit', value: data.unit),
              DataGridCell<num>(columnName: 'CompareProduction', value: data.compareProduction),
              DataGridCell<Widget>(
                columnName: 'Status',
                value: Container(
                  alignment: Alignment.center,
                  padding: const EdgeInsets.all(8.0),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Container(
                          padding: const EdgeInsets.only(
                            left: 8,
                            right: 8,
                          ),
                          decoration: BoxDecoration(
                            color: HexColor(data.colorStatus).withOpacity(0.2),
                            borderRadius: BorderRadius.circular(20),
                          ),
                          child: Text(data.statusName, style: TextStyle(color: HexColor(data.colorStatus)))),
                    ],
                  ),
                ),
              ),
              DataGridCell<Column>(
                  columnName: 'Open/Edit',
                  value: Column(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      IconButton(
                          onPressed: () {
                            var state = GoRouter.of(context).state!.uri;
                            String currentPath = state.path;
                            String path = Routes.dataCollectionPeriod;
                            String idEmission = data.id;
                            if (kDebugMode) {
                              print(idFormBase64(id: idEmission));
                            }
                            GoRouter.of(context).go(Uri(
                              path: "$currentPath/$path",
                              queryParameters: {
                                'emission': idEmission,
                              },
                            ).toString());
                          },
                          icon: Icon(Icons.edit_square)),
                    ],
                  )),
            ],
          ),
        )
        .toList();
  }

  List<DataGridRow> dataGridRow = [];

  @override
  List<DataGridRow> get rows => dataGridRow;

  @override
  DataGridRowAdapter buildRow(DataGridRow row) {
    return DataGridRowAdapter(
      cells: row.getCells().map<Widget>((e) {
        return e.value.runtimeType.toString() == 'Container' || e.value.runtimeType.toString() == 'Column'
            ? e.value
            : Container(
                alignment: e.value.runtimeType.toString() != 'String' ? Alignment.centerRight : Alignment.centerLeft,
                padding: const EdgeInsets.all(8.0),
                child: e.value.runtimeType.toString() != 'String'
                    ? Text(
                        //Check Int or Double
                        (e.value is int || e.value % 1 == 0)
                            ? NumberFormat.decimalPatternDigits(decimalDigits: 0).format(e.value)
                            : NumberFormat.decimalPatternDigits(decimalDigits: 2).format(e.value),
                      )
                    : Text(e.value.toString()),
              );
      }).toList(),
    );
  }
}

Code sample

Code sample

```dart [Add your code here] ```

Screenshots or Video

Screenshots / Video demonstration

[Upload media here]

Stack Traces

Stack Traces

```dart [Add the Stack Traces here] ```

On which target platforms have you observed this bug?

Web

Flutter Doctor output

Doctor output

```console [Add your output here] ```

[SethupathyD]

Hi @thisadee2897 , We tried using the code snippets you provided but were unable to run the sample. Could you please provide a runnable sample so that we can test it on our end? This will greatly assist us in investigating the issue further and providing an appropriate solution as quickly as possible.

regards, Sethupathy D.