@boikom

@boikom

Forum Replies Created

Viewing 15 posts - 61 through 75 (of 877 total)
  • Author
    Posts
  • in reply to: Bundle size of 2.9 MB #103847
    admin
    Keymaster

    Hi Hugh,

    The smart.ui.grid is a web component with shadow dom and it includes all the styles imported in the shadow root.
    In the default case, the smart.grid.js is used instead as it includes only the scripts. In that case, the CSS styles file is referred usually from index page, angular.json in angular or import in react. The css file name is smart.default.css. In most of the demos on our website, we use smart.grid.js. In examples with stencil and where we want to demonstrate a web component with a shadow dom enabled, we use the wrapper web component smart.ui.grid.js. The smart.grid.js module is 2MB. The inline CSS used in smart.grid.js cannot be moved to a separate file, because it is related to things like rows & columns resize i.e we need dynamic width, height, left and top settings, the scrolling is also part of this. We have scrolling with fixed columns and many additional features which require small amount of inline css. Unfortunately, I do not think that you can make the bundle smaller. We have another option with the more lightweight smart.table component, but it does not have all the features of the Grid.

    Best regards,
    Peter Stoev

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

    in reply to: Data Grid Checkbox Unselect keeps row highlighted #103827
    admin
    Keymaster

    Hi Kris,

    The focus is much related to the keyboard navigation in order to inform the user where the keyboard navigation starts from. We will consider your comments by adding a property to disable the keyboard navigation so in that case, we would not add focus to elements.

    Best regards,
    Peter Stoev

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

    in reply to: No theme attribute for Grid Webcomponent #103826
    admin
    Keymaster

    Hi Hugh Anderson,

    This is a missing functionality for the ui-grid with shadow dom enabled. We will create a work item about this and resolve it in a future release.

    Best regards,
    Peter Stoev

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

    in reply to: Data Grid Checkbox Unselect keeps row highlighted #103823
    admin
    Keymaster

    Hi Kristopher,

    The behavior is actually by design. When you check/uncheck the row’s selection is changed. However, the row is on focus as it is the currently active element after you clicked it and if you press the arrow up/down you can notice that the focus selection starts from it. If you check more than 1 row, you will notice that the style of the selected rows and the focused row are different. If you want to turn off this, you can edit the CSS style for the smart-grid-cell element when the smart-grid-row has the focus attribute.

    Best regards,
    Peter Stoev

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

    in reply to: Opensource more fast response #103811
    admin
    Keymaster

    Hi,

    Thank you for your 1st post in our Forum. Unfortunately, it is a SPAM.
    If you have any questions regarding our products, feel free to post here.

    Best regards,
    Peter Stoev

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

    in reply to: Problem with ColumnGroups && CommandColumn #103768
    admin
    Keymaster

    Hi,

    This is an issue in the Grid. It will be resolved as soon as possible.

    Thank you for the feedback! We appreciate it!

    Best regards,
    Peter Stoev

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

    in reply to: Blazor Carousel enable Swipe/Touch Screen #103756
    admin
    Keymaster

    Hi MikeB,

    swipe on touch is still not implemented for the blazor carousel component. We have it as a feature in our TO DO list for the upcoming releases.

    Best regards,
    Peter Stoev

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

    in reply to: Material theme #103755
    admin
    Keymaster

    Hi,

    The Default theme is a Material design-based theme. If you need to switch to a different color scheme of that theme, you need to add a link to source/styles/smart.purple.css after smart.default.css in your app. The same is valid for the rest of the available color schemes.

    Best regards,
    Peter Stoev

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

    in reply to: RowDetail event #103732
    admin
    Keymaster

    Hi,

    We have a callback function – onRowDetailUpdated{(index: number, row: Smart.Grid.Row, details: HTMLElement): void}. It is called each time the row detail is expanded/collapsed and requests an update.

    Best regards,
    Peter Stoev

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

    in reply to: Set grid cell color property #103731
    admin
    Keymaster

    Hi Martin,

    These options work for cells not in view as well. For example:

    Smart('#grid', class {
        get properties() {
            return {
                dataSource: new Smart.DataAdapter(
    			{
    			    dataSource: generateData(1000),
    			    dataFields:
    				[
    					'id: number',
    					'firstName: string',
    					'lastName: string',
    					'productName: string',
                        'available: bool',
    					'quantity: number',
    					'date: date',
    					'price: number',
    					'total: number'
    				]
    			}),
              selection: {
                                enabled: true,
                                allowCellSelection: true,
                                //allowRowHeaderSelection: true,
                                //allowColumnHeaderSelection: true,
                                mode: 'extended'
                            },
                            editing: {
                                enabled: true,
                                mode: 'cell'
                            },
                            sorting: {
                                enabled: true
                            },
                            filtering: {
                                enabled: true
                            },
                            behavior: { columnResizeMode: 'growAndShrink' },
                            appearance: {
                                alternationCount: 2,
                                allowHover: true
                            },
                columns: [
    			{
    			    label: 'First Name', dataField: 'firstName'
    			},
    			{
    			    label: 'Last Name', dataField: 'lastName'
    			},
    			{ label: 'Product', dataField: 'productName', editor: 'autoComplete' },
    			{ label: 'Order Date', width: 250, cellsFormat: 'dd-MM-yyyy', dataField: 'date', editor: {
    				template: 'dateTimePicker',
    				formatString: 'dd-MM-yyyy',
    				onInit(index, dataField, editor){
    				}
    			}
    			},
    			{ label: 'Quantity', dataField: 'quantity', editor: 'numberInput' },
    			{ label: 'Unit Price', dataField: 'price', editor: 'numberInput', cellsFormat: 'c2' }
                ]
            }
        }
    });
    window.onload = ()=> {
      window.grid.rows[100].cells[0].color = 'red';
    }

    The above code sets a ‘red’ color to the first cell in the row with index = 100 which is not in the view. When you scroll vertically to that row, you will see that the cell is in red.

    For more details about styling the grid cells, you can look at: https://www.htmlelements.com/docs/grid-styling-cells/

    Best regards,
    Peter Stoev

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

    in reply to: Onchange event fires too early #103728
    admin
    Keymaster

    Hi,

    This is an issue in the component which will be resolved in the next release. The ‘change’ event shouldn’t be raised when you type in the filter.

    Best regards,
    Peter Stoev

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

    in reply to: Checkbox on focus doesn’t fire #103723
    admin
    Keymaster

    Hi Tullio,

    onfocus happens before onchange. When an element is already on focus, it will raise only onchange when the value is changed. We did not find any issue on our side.
    In your post, you’re writing about sequence. The tab order for the focus depends on the tabindex property of the HTML Elements – any html elements, not just smart html elements. If you add the smart-check-box tag to your DOM, it will be in the DOM and after the DOM is loaded(use onload event to ensure it), then you will be able to use querySelector, getElementById, etc.

    Best Regards,
    Peter Stoev

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

    in reply to: Checkbox on focus doesn’t fire #103719
    admin
    Keymaster

    Hi,

    Yes, and that is exactly how it should work. Focus is raised when you click, after that Change is raised as it changes the state from true->false or false->true. Then when it is on focus, only Change event is raised as only the state is changed, the focus is not. When you click outside and focus a different element and after that click again on the checkbox, the focus and changed will be raised.

    Best Regards,
    Peter Stoev

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

    in reply to: MacOS DOT NET CORE Blazor #103685
    admin
    Keymaster

    Hi Ashley,

    Thanks for the update! That might help the others in the forum.

    Best regards,
    Peter Stoev

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

    in reply to: Change format function number inputs #103662
    admin
    Keymaster

    Hi Rafa,

    Formatting of numbers is based on the ‘locale’ setting and the numberFormat property. Smart.NumberInput uses https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat and this makes it unnecessary to have properties like decimalSeparator as it is applied automatically.

    Best regards,
    Peter Stoev

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

Viewing 15 posts - 61 through 75 (of 877 total)