Products

[Markov]

Hi,

The summary of the column can be set to a function so it can calculate a custom summary.

` columns: [
{
label: ‘#’, width: 200, dataField: ‘id’
},
{
label: ‘First Name’, dataField: ‘firstName’
},
{ label: ‘Last Name’, dataField: ‘lastName’ },
{ label: ‘Product’, dataField: ‘productName’ },
{ label: ‘Quantity’, dataField: ‘quantity’, summary: [‘min’, ‘max’], align: ‘right’, cellsAlign: ‘right’, },
{ label: ‘Unit Price’, dataField: ‘price’, align: ‘right’, cellsAlign: ‘right’, cellsFormat: ‘c2’ },
{
label: ‘Total’, dataField: ‘total’, align: ‘right’, summary: ([{
‘Custom’: (currentValue, cellValue, dataField, data) => {
return currentValue + cellValue
}
}]), cellsAlign: ‘right’, cellsFormat: ‘c2’
}
]`

Best regards,
Markov

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

[Markov]

Hi,

To conditionally format items, you can use the onTaskRender callback function.

onTaskRender
function | null
This function enables complete customization of the task element within your interface. It accepts five arguments, providing granular control over both the task and its visual representation:

1. 'task' – The full task object containing all associated data.
2. 'segment' – The current segment object for the task. If the task consists of a single segment, this argument will be the same as the task object.
3. 'taskElement' – The root HTML element representing the task in the DOM.
4. 'segmentElement' – The HTML element representing the current segment of the task.
5. 'labelElement' – The HTML element that displays the segment’s label.

Best regards,
Markov

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

[Markov]

Hi,

It is supported. You can load tasks on demand. For example, check this demo with Paging: https://www.htmlelements.com/demos/gantt/paging/. It is possible to handle the pager’s events and put data on demand.

Best regards,
Markov

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

[Markov]

Hi,

Yes, this is absolutely possible. Just add the Gantt chart to a smart-window instance and it will be displayed inside its.

Best regards,
Markov

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

[Markov]

Hi,

To get or set the Editor’s value dynamically, you can use its value property.

Here is a basic sample which i hope will help you:

` // Initialize Firebase
const firebaseConfig = {
apiKey: “AIzaSy…yourKey…”,
authDomain: “yourapp.firebaseapp.com”,
projectId: “yourapp”,
storageBucket: “yourapp.appspot.com”,
messagingSenderId: “1234567890”,
appId: “1:1234567890:web:abcdef”
};

const app = firebase.initializeApp(firebaseConfig);
const db = firebase.firestore();

const editor = document.getElementById(‘editor’);

// Save content to Firestore
document.getElementById(‘saveBtn’).addEventListener(‘click’, async () => {
const htmlContent = editor.value;
await db.collection(‘documents’).doc(‘exampleDoc’).set({ content: htmlContent });
alert(‘Saved to Firebase!’);
});

// Load content from Firestore
document.getElementById(‘loadBtn’).addEventListener(‘click’, async () => {
const doc = await db.collection(‘documents’).doc(‘exampleDoc’).get();
if (doc.exists) {
editor.value = doc.data().content;
} else {
alert(‘No content found!’);
}`

Best regards,
Markov

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

[Markov]

Hi,

You can bind the Kanban, handle its ‘change’ event and make updates to the original array or backend synchronization.

<smart-kanban id="kanban" editable></smart-kanban>
    <div id="output">Task count: <span id="count">0</span></div>

    <script>
        const tasks = [
            { id: 1, label: 'Task 1', status: 'To Do', priority: 'High' },
            { id: 2, label: 'Task 2', status: 'In Progress', priority: 'Low' }
        ];

        const kanban = document.getElementById('kanban');
        kanban.dataSource = tasks;
        kanban.columns = [
            { label: 'To Do', dataField: 'toDo' },
            { label: 'In Progress', dataField: 'inProgress' },
            { label: 'Done', dataField: 'done' }
        ];

        // Two-way binding: Changes in UI update the array
        kanban.addEventListener('change', (e) => {
        
        });

Best regards,
Markov

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

[Markov]

Hi,

You can take a look at https://www.htmlelements.com/demos/scheduler/custom-event-render/. The demo shows how to customize the rendering of the events.

Hope this helps.

Best regards,
Markov

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

[Markov]

Hi linda,

With the virtualization of the Table, it could handle tens of thousands of data rows and columns. You can also load data on demand with the Paging functionality.
As for editing, just set editable: true and the editing will be enabled.

Best regards,
Markov

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

[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/

[Author]

Posts