Products

[YavorDashev]

Hi Dark Becccio,
Yes, the functionality you need is possible with the SmartGrid component and I have also create a quick code example using the demo for adding columns to the grid as a base for it.

  addColumn.addEventListener('click', function (event) {
        for (let i = 0; i < columnsList.length; i++) {
            let alreadyAdded = false;
            for (let j = 0; j < columns.length; j++) {
                const column = columns[j];
                if (column && column.label === columnsList[i]) {
                    alreadyAdded = true;
                    break;
                }
            }
            if (alreadyAdded) {
                continue;
            }
            let gridDataFields =  grid.dataSource.dataFields;
            const newDataField = {name: 'ID', dataType:'number'};
            gridDataFields.push(newDataField);
            const newGridDataSource = new window.Smart.DataAdapter({
                dataSource: window.getCountriesData(),
                dataFields: gridDataFields
            });
            grid.dataSource= newGridDataSource;
            const newColumn = new window.Smart.Grid.Column({ label: columnsList[i], dataField: columnsList[i] });
            columns.push(newColumn);
            grid.refresh();
            break;
        }
        updateButtonsDisabledState();
    });

Note that I have removed the “ID” datafield from the grid’s datasource when its initialy loaded like so:

window.Smart('#grid', class {
    get properties() {
        return {
            dataSource: new window.Smart.DataAdapter({
                dataSource: window.getCountriesData(),
                dataFields: [
                    'Country: string',
                    'Area: number',
                    'Population_Urban: number',
                    'Population_Rural: number',
                    'Population_Total: number',
                    'GDP_Agriculture: number',
                    'GDP_Industry: number',
                    'GDP_Services: number',
                    'GDP_Total: number'
                ]
            }),
            columns: [
                'Country',
                'Area',
                'Population_Rural',
                'Population_Total',
                'GDP_Total'
            ]
        };
    }
});

Let me know if that works for you!
Please, do not hesitate to contact us if you have any additional questions.
Best regards,
Yavor Dashev
Smart UI Team
https://www.htmlelements.com/

[YavorDashev]

Hi davout,
AS from you post I suggest that you want to get the value of the smart-radio-button component and not its boolean value.
If so you can do so using the change event and using you method:

//In your app.component.ts file
  onRecurringIntervalChange(event:any):void {
    let radioButtonValue: EventTarget = event.target.value;
    console.log(radioButtonValue)
  }
 

And for the starting selection it depends on which of the radio buttons you set the checked property and if you don’t set it to either of them none of them will be selected.
Let me know if that works for you!
Please, do not hesitate to contact us if you have any additional questions.
Best regards,
Yavor Dashev
Smart UI Team
https://www.htmlelements.com/

[YavorDashev]

Hi Michele,
Thank you for the additional information!
I will do some more tests to see if the problem is coming form the DockingLayout or the Monaco editor.
If I find any bug regarding our components it will be added a work item for it and resolved as soon as we are able to.
Please, do not hesitate to contact us if you have any additional questions.
Best regards,
Yavor Dashev
Smart UI Team
https://www.htmlelements.com/

[YavorDashev]

Hi tullio0106,
I have created a quick code example that showcases you how to achieve the functionality you need.
In your html file:

    <smart-drop-down-list  drop-down-open-mode='dropDownButton' display-member="value" drop-down-height='800' drop-down-width='800'>
            <smart-list-item value="first image">
                <img src="path to your image" alt="">
            </smart-list-item>
            <smart-list-item value="second image">
                <img src="path to your image" alt="">
            </smart-list-item>
    </smart-drop-down-list>
 

And also some necessary CSS:

smart-drop-down-list{
	min-height: 35px;
	height: auto;
}
.smart-list-item-container img {
	width: 100%;
	height: 100%;
}
smart-list-item .smart-content,
smart-list-item .smart-overlay,
smart-list-item,
smart-drop-down-list {
	height: 300px;
}

Let me know if that works for you!
Please, do not hesitate to contact us if you have any additional questions.
Best regards,
Yavor Dashev
Smart UI Team
https://www.htmlelements.com/

[Author]

Posts