Demos

[Markov]

Hi,

We do not have known issues with the Kanban. Also, set the virtualization: true property and it will be in virtualized mode.

Hope this helps.

Best regards,
Markov

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

[Markov]

Hi,

For example:

<template>
  <smart-editor :value="content" @change="onChange"></smart-editor>
  <p>Editor content: {{ content }}</p>
</template>

<script>
export default {
  data() {
    return {
      content: "<p>Hello World</p>"
    };
  },
  methods: {
    onChange(event) {
      this.content = event.detail.value; // Smart.Editor emits the new value here
    }
  }
};
</script>

Hope this helps.

Best regards,
Markov

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

[Markov]

Hi,

Please, look at https://www.htmlelements.com/docs/table-css/. The help topic shows how to customize the themes of the Table component.

Best regards,
Markov

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

[Markov]

Hi,

No, we do not support server-side rendering. Our components are client-side components written in Javascript.

Best regards,
Markov

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

[Markov]

Hi,

You can use its setDate and getDate methods to set and get dates or bind its value property to a Blazor variable.

<DateTimePicker @bind-Value="@selectedDate" FormatString="dd/MM/yyyy HH:mm" />

<p>Selected: @selectedDate</p>

@code {
    private DateTime selectedDate = DateTime.Now;
}

Best regards,
Markov

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

[Markov]

Hi,

You can use the “change” event. It is triggered when the content is changed.

Best regards,
Markov

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

[Markov]

Hi,

This is the specific path. It is in the source/modules folder.

Best regards,
Markov

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

[Markov]

Hi,

You can theme Smart Kanban in a web project by overriding its built-in CSS variables and styles, without modifying the library’s core files.

Smart UI components, including Kanban, are built with CSS custom properties (variables), which makes theming straightforward.

For example:

--smart-primary: #3f51b5;
--smart-background: #ffffff;
--smart-surface: #f5f5f5;
--smart-border-color: #ddd;
--smart-border-radius: 4px;
--smart-font-size: 14px;
--smart-kanban-column-header-background: #f0f0f0;
--smart-kanban-task-background: #fff;

Best regards,
Markov

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

[Markov]

Hi,

Yes, it is possible to lazy load the Kanban. Please, take a look at : https://www.htmlelements.com/react/demos/kanban/server-side-crud/
Best regards,
Markov

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

[Markov]

Hi,

Please, look at: https://www.htmlelements.com/demos/table/overview/. The demo shows how to render custom content in the Table.

Best regards,
Markov

Smart Team
https://www.jqwidgets.com/

[Markov]

Hi,

You can use the animationDuration property.

const sampleData = [
    { Day: 'Monday', Keith: 30, Erica: 15, George: 25 },
    { Day: 'Tuesday', Keith: 25, Erica: 25, George: 30 },
    { Day: 'Wednesday', Keith: 30, Erica: 20, George: 25 },
    { Day: 'Thursday', Keith: 35, Erica: 25, George: 45 },
    { Day: 'Friday', Keith: 20, Erica: 20, George: 25 },
    { Day: 'Saturday', Keith: 30, Erica: 20, George: 30 },
    { Day: 'Sunday', Keith: 60, Erica: 45, George: 90 }
];

const chart = new smartChart('#chart', {
	animationDuration: 500,
	caption: 'Fitness & exercise weekly scorecard',
	description: 'Time spent in vigorous exercise',
	dataSource: sampleData,
	xAxis:
	{
		dataField: 'Day',
		gridLines: {
			visible: true
		}
	},
	valueAxis:
	{
		description: 'Time in minutes',
		axisSize: 'auto',
		minValue: 0,
		maxValue: 100,
		unitInterval: 10
	},
	seriesGroups:
	[
		{
			type: 'column',
			columnsGapPercent: 50,
			seriesGapPercent: 0,
			series: [
				{ dataField: 'Keith', displayText: 'Keith' },
				{ dataField: 'Erica', displayText: 'Erica' },
				{ dataField: 'George', displayText: 'George' }
			]
		}
	]
});

Best regards,
Markov

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

[Markov]

Hi,

Yes, this is possible. The chart has a ‘click’ event. The event is triggered when the user clicks on a series element within the chart. This allows developers to respond to user interactions with individual data points, such as displaying details, highlighting the selected element, or performing custom actions based on the clicked series element.

Best regards,
Markov

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

[Markov]

Hi,

Yes, we support server side rendering in our Smart.Table. Please, look at https://www.htmlelements.com/demos/table/server-side-crud/

Hope this helps.

Best regards,
Markov

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

[Markov]

Hi,

Please, look at https://www.htmlelements.com/demos/input/multi-combo-input/.

As for state management, you can use something like this:

// React component
import { MultiComboInput } from 'smart-webcomponents-react/multicomboinput';
import { useSelector, useDispatch } from 'react-redux';

const FruitSelector = () => {
    const selectedFruits = useSelector(state => state.selectedFruits);
    const dispatch = useDispatch();

    const handleChange = (event) => {
        const value = event.detail.value;
        dispatch({ type: 'SET_FRUITS', payload: value });
    };

    return (
        <MultiComboInput
            dataSource={['Apple', 'Banana', 'Orange', 'Grape']}
            selectedValues={selectedFruits}
            onChange={handleChange}
        />
    );
};

Best wishes,
Markov

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

[Markov]

Hi,

The data export options supported by our editor are HTML and PDF. Here is a link: https://www.htmlelements.com/demos/editor/export-html/

Best regards,
Markov

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

[Author]

Posts