Products

[admin]

Hi davout,
We cannot reproduce an issue with the provided details. If you share a stackblitz sample which shows your scenario and the behavior which you report, we will try it once again.
Best regards,
Peter Stoev
Smart UI Team
https://www.htmlelements.com/

[admin]

We publish the information about new releases here: https://www.htmlelements.com/docs/release-notes/, https://www.htmlelements.com/blog/, https://www.facebook.com/jqwidgets and https://twitter.com/jqwidgets.

[admin]

Hi dijar.kadriu,
It definitely will be in a future version of the DataGrid component.
Best regards,
Peter Stoev
Smart UI Team
https://www.htmlelements.com/

[admin]

Hi Joko Pitoyo,
The source code for the Admin Templates is available for licensed users. In order to get it, you need to login our client portal and download the Smart UI source code package. The src folder for the Admin Templates is called ‘templates’.
Best regards,
Peter Stoev
Smart UI Team
https://www.htmlelements.com/

[admin]

Hi dijar.kadriu,
The Blazor Grid currently does not support nested grids.
Best regards,
Peter Stoev
Smart UI Team
https://www.htmlelements.com/

[admin]

Hi dijar.kadriu,
We will have such event in the next version of the Datagrid component which is planned for the next week.
Best regards,
Peter Stoev
Smart UI Team
https://www.htmlelements.com/

[admin]

Hi Riyaz Quresh,
That blazor demo is available online only for the moment. We will consider adding it to the download package, too.
Best regards,
Peter Stoev
Smart UI Team
https://www.htmlelements.com/

[admin]

It works, many thanks!

[admin]

Hi Peter,
Sorry for the late reply. It works, thanks for your help!
One last question 🙂
We want the tab position to be on the left or right and we need the option of automatic height (https://www.htmlelements.com/demos/tabs/auto-height/).
But when we use the right tab position and the auto height styles the transition doesn’t work properly. The tab to be slides in is not animated and the tab that slides away is visible in the background.
can you help ?
many Thanks!

[admin]

Example with Scrollbar that changes DIV tag using Smart.Blazor 9.4.15
Here is a sample built with Smart.Blazor 9.4.15

@page "/"
<Example Name="ScrollBar">
	<ScrollBar @ref="scrollbar" OnChange="ChangeHandler"></ScrollBar>
    <div style="@scrollStyle">
        Some text content here Some text content here Some text content here Some text content here
        Some text content here Some text content here Some text content here Some text content here
        Some text content here Some text content here Some text content here Some text content here
        Some text content here Some text content here Some text content here Some text content here
        Some text content here Some text content here Some text content here Some text content here
        Some text content here Some text content here Some text content here Some text content here
        Some text content here Some text content here Some text content here Some text content here
        Some text content here Some text content here Some text content here Some text content here
        Some text content here Some text content here Some text content here Some text content here
        Some text content here Some text content here Some text content here Some text content here
        Some text content here Some text content here Some text content here Some text content here
        Some text content here Some text content here Some text content here Some text content here
    </div>
</Example>
@code {
    ScrollBar scrollbar;
    string scrollStyle = "overflow: auto; width: 100px; height:100px;";
    private void ChangeHandler(Event args) {
        ScrollBarChangeEventDetail detail = args["Detail"] as ScrollBarChangeEventDetail;
        scrollStyle = "overflow: auto; width: " + detail.Value + "px; height: " + detail.Value + "px;";
    
        Console.WriteLine(detail.OldValue + "/" + detail.Value);
    }
}

Best regards,
Peter Stoev
Smart UI Team
https://www.htmlelements.com/

[admin]

Hi ORE,
You are right. Sorry, about that. I missed to add that 2 more files are required.

   <link rel="stylesheet" type="text/css" href="../../../source/styles/components/smart.base.css" />
    <link rel="stylesheet" type="text/css" href="../../../source/styles/components/smart.tabs.css" />
    <link rel="stylesheet" type="text/css" href="../../../source/styles/components/smart.common.css" />

When you use more components on the page and want to load only these styles, add them between smart.base.css and smart.common.css.
Best regards,
Peter Stoev
Smart UI Team
https://www.htmlelements.com/

[admin]

Hi Peter,
Thanks for your answer. I’ve tried it , but it doesn’t work. I think some CSS is missing. For example: The file  \source\styles\components\smart.tabs.css contains some variables, so I also tried adding the \source\styles\default\smart.variables.css. But even then it doesn’t work properly.
Best regards

[admin]

Hi Dark Beccio,
Could you post a sample which demonstrates that?
The following code which is a modification of our Data Export example with Paging enabled data exports the full data set, not only the first page’s

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',
                    'quantity: number',
                    'price: number',
                    'total: number'
                ]
            }),
            pager: {
                visible: true
            },
            paging: {
                enabled: true
            },
            columns: [
                'id',
                {
                    label: 'First Name', dataField: 'firstName'
                },
                { label: 'Last Name', dataField: 'lastName' },
                { label: 'Product', dataField: 'productName' },
                { label: 'Quantity', dataField: 'quantity', align: 'right', cellsAlign: 'right', },
                { label: 'Unit Price', dataField: 'price', align: 'right', cellsAlign: 'right', cellsFormat: 'c2' },
                { label: 'Total', dataField: 'total', align: 'right', cellsAlign: 'right', cellsFormat: 'c2' }
            ]
        };
    }
});
function init() {
    const grid = document.querySelector('jqx-grid');
    const xlsxBtn = document.querySelector('#xlsxBtn');
    const pdfBtn = document.querySelector('#pdfBtn');
    const csvBtn = document.querySelector('#csvBtn');
    const tsvBtn = document.querySelector('#tsvBtn');
    const xmlBtn = document.querySelector('#xmlBtn');
    const htmlBtn = document.querySelector('#htmlBtn');
    xlsxBtn.addEventListener('click', () => {
        grid.exportData('xlsx');
    });
    pdfBtn.addEventListener('click', () => {
        grid.exportData('pdf');
    });
    csvBtn.addEventListener('click', () => {
        grid.exportData('csv');
    });
    tsvBtn.addEventListener('click', () => {
        grid.exportData('tsv');
    });
    xmlBtn.addEventListener('click', () => {
        grid.exportData('xml');
    });
    htmlBtn.addEventListener('click', () => {
        grid.exportData('html');
    });
}

Best regards,
Peter Stoev
Smart UI Team
https://www.htmlelements.com/

[admin]

Hi ORE,
You can use \source\styles\components\smart.tabs.css file instead. It includes all styles for the tabs component and is only 25KB.
Best regards,
Peter Stoev
Smart UI Team
https://www.htmlelements.com/

[admin]

Hi klslead,
Thank you for the Scheduler’s timeline suggestion.
Best regards,
Peter Stoev
Smart UI Team
https://www.htmlelements.com/

[Author]

Posts