Products

[Markov]

Hi,

You can use the Column’s formatFunction to change what is displayed in the cells of a given column. In order to use the formatFunction, you will need to handle it through jsInterop as it is a dynamically called function on each cell refresh.

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Markov]

Hi,

We could not reproduce the provided behavior using the current version of Smart.Blazor. In our tests, we tested with various setups like freezing the first column, the last column, the first and the last column, setting different widths of the Grid. Please, send a complete demo to support@jqwidgets.com as there could be some additional factors which may be the reason of the behavior reported here.

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Markov]

Hi Federica,

You can use the dataExport’s cellFormatFunction to format the exported values.

Here is a demo which shows how to use it: https://www.htmlelements.com/demos/grid/data-export-hyperlinks/

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Markov]

Hi,

Yes, just set the theme property of the Chart to “dark”.

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Markov]

Hi,

Please, look at https://www.htmlelements.com/demos/input/overview/. The demo shows the 3 different rendering modes of the Input.

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Markov]

Hi,

At present our Gantt does not support task reorder. We will consider adding this functionality in the future versions of the component.

Thank you for the feature request!

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Markov]

Hi,

In the last week of November, we will release an update of Smart UI.

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Markov]

Hi,

https://www.htmlelements.com/demos/table/overview/ – this example shows how to customize the rendering of the Table component.

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Markov]

Hi,

Please, look at https://www.htmlelements.com/demos/table/html-virtualization/

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Markov]

Hi,

Please, look at https://www.htmlelements.com/docs/table/

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Markov]

Hi,

Smart.Grid supports client-side rendering only, but there is no problem to use it with NextJS as we have prepared the component for such scenarios. You can look at https://www.htmlelements.com/docs/grid/ which shows how to use it with next js in server side rendering scenarios.

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Markov]

Hi,

I saw the updated codepen example. The updateRow should update the row details as well while it does not currently without calling the render method. We will update this for the next version.

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Markov]

Hi,

You can look at it:

<smart-kanban
  #kanban
  [dataSource]="data"
  [columns]="columns"
  (cardUpdate)="onTaskUpdate($event)">
</smart-kanban>

import { Component, OnInit, ViewChild } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-kanban',
  templateUrl: './kanban.component.html'
})
export class KanbanComponent implements OnInit {
  @ViewChild('kanban', { static: false }) kanban: any;

  data: any[] = [];
  columns = [
    { dataField: 'todo', label: 'To Do' },
    { dataField: 'inProgress', label: 'In Progress' },
    { dataField: 'done', label: 'Done' }
  ];

  constructor(private http: HttpClient) {}

  ngOnInit() {
    this.loadData();
  }

  loadData() {
    this.http.get<any[]>('https://api.example.com/tasks').subscribe((tasks) => {
      this.data = tasks;
    });
  }

  onTaskUpdate(event: CustomEvent) {
    const { card, oldColumn, newColumn } = event.detail;
    this.http.patch(<code>https://api.example.com/tasks/${card.id}</code>, {
      status: newColumn.dataField
    }).subscribe();
  }
}

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Markov]

Hi,

Please, look at https://www.htmlelements.com/demos/kanban/export/

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Markov]

Hi,

In the Grid’s API Docs – https://www.htmlelements.com/docs/grid-api/, take a look at the events section which shows how to handle events.

Here is an example for reference:

<smart-grid
  #grid
  [dataSource]="data"
  [columns]="columns"
  (cellBeginEdit)="onCellBeginEdit($event)"
  (cellEndEdit)="onCellEndEdit($event)"
  (rowSelect)="onRowSelect($event)"
></smart-grid>

onCellBeginEdit(event: CustomEvent) {
  const { row, column } = event.detail;
  console.log('Editing started for:', row, column);
}

onCellEndEdit(event: CustomEvent) {
  const { row, column, value } = event.detail;
  console.log(<code>New value in ${column.dataField}:</code>, value);
}

onRowSelect(event: CustomEvent) {
  console.log('Selected row:', event.detail.row);
}

Hope this helps.

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Author]

Posts