Products

[admin]

Hi Matias,

Could you share a Stackblitz sample which reproduces your use-case so our developers will be able to test it?

Best regards,
Peter Stoev

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

[admin]

Hi,

You can look at https://www.htmlelements.com/angular/demos/fileupload/item-template/. That demo shows how to use the ItemTemplate property. You can edit the demo in Stackblitz. The Template is defined in the index.html. Here is how the template is declared in the demo:

<template id="itemTemplate">
  <smart-progress-bar>{{filename}}</smart-progress-bar>
</template>

You can use the filename property as a parameter in the template. The HTML structure of the template can be edited based on your web application requirements.

Best regards,
Peter Stoev

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

[admin]

Hi,

The demo loads images from a local hard drive where the demo is hosted. For that purpose a relative URL is used.

Best regards,
Peter Stoev

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

[admin]

Hi,

You can look at: https://www.htmlelements.com/demos/cardview/overview/. It loads images from local hard drive where the demo is hosted. For that purpose a relative URL is used.

Best regards,
Peter Stoev

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

[admin]

Hi VAISHNAVI,

You can use the approach with Smart.Grid here. Example: https://www.htmlelements.com/demos/grid/server-side-mysql-php/

Best regards,
Peter Stoev

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

[admin]

Hi and thank you for the interest,

In the first example we use local images: https://www.htmlelements.com/demos/cardview/overview/

Best regards,
Peter Stoev

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

[admin]

Hi Joko,

The release is available since last week.

Best regards,
Peter Stoev

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

[admin]

Hi Joko,

Smart.Layout is not yet released and is not in production. The available UI components have online demos & documentation.

Best regards,
Peter Stoev

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

[admin]

Hi,

Please, take a look at https://www.htmlelements.com/demos/tree/add-remove-items/. The example shows how to insert, update and remove tree items.

Best regards,
Peter Stoev

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

[admin]

Hi Matias Galante,

Our themes follow the Material design guidelines and that is the reason button texts are upper case. In order to make them normal case, you can use CSS or SCSS.

Example:

smart-button {
text-transform: initial !important;
}

Hope this helps.

Best regards,
Peter Stoev

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

[admin]

Hi,

We released an update of our React components with the fix for the DateRangeInput component. The sources for the demo are updated online, too.

Best regards,
Peter Stoev

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

[admin]

Hi,

Thank you for the feedback. We tested this with the latest React version and there is an error in the DateRangeInput React component. It is missing an important import in the references list. We will update this as soon as possible. When we update and resolve the issue, the topic will be updated, too.

Best regards,
Peter Stoev

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

[admin]

Hi Matias,

In order to style the buttons you can use CSS and set the background and color CSS properties.

.smart-upload-all-button – CSS class for upload button.
.smart-cancel-all-button – CSS class for cancel button.
.smart-pause-all-button – CSS class for pause button.
.smart-browse-button – CSS class for browse button.

Best regards,
Peter Stoev

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

[admin]

Hi coderelayer,

Unfortunately, we do not have integration help topics with Inertia.js and have not used it. I will create a work item for adding a doc topic about that in the future.
Basically, the Grid can display data from simple Javascript array so if you pass such, it will display it.

Best regards,
Peter Stoev

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

[admin]

Hi Christophe Weibel,

The methods which you used does not refresh the data source. They refresh the HTML Elements used in the grid i.e re-create them, update the layout, etc.

Here is an example which shows how to use the onRowUpdate

window.Smart('#grid', class {
    get properties() {
        return {
            dataSource: new window.Smart.DataAdapter({
                dataSource: window.generateData(100),
                dataFields: [
                    'id: number',
                    'firstName: string',
                    'lastName: string',
                    'productName: string',
                    'available: bool',
                    'quantity: number',
                    'price: number',
                    'total: number'
                ]
            }),
            editing: {
                enabled: true,
                mode: 'row'
            },
            onRowUpdate(index, row, oldValue, value, confirm) {
                if (value.firstName === 'Test') {
				   confirm(true);
                }
                else {
                    confirm(false);
                }
            },
            selection: {
                enabled: true,
                allowCellSelection: true,
                allowRowHeaderSelection: true,
                allowColumnHeaderSelection: true,
                mode: 'extended'
            },
            columns: [
                {
                    label: 'First Name', dataField: 'firstName'
                },
                { label: 'Last Name', dataField: 'lastName' },
                { label: 'Product', dataField: 'productName' },
                { label: 'Available', dataField: 'available', template: 'checkBox', editor: 'checkBox' },
                { label: 'Quantity', dataField: 'quantity', editor: 'numberInput' },
                { label: 'Unit Price', dataField: 'price', editor: 'numberInput', cellsFormat: 'c2' }
            ]
        };
    }
});

In the above code, when the firstName column’s value is ‘Test’, changes are saved, otherwise they are not.

Best regards,
Peter Stoev

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

[Author]

Posts