@yavor-dashev

@yavor-dashev

Forum Replies Created

Viewing 15 posts - 1 through 15 (of 36 total)
  • Author
    Posts
  • in reply to: Change row height of the time line month view #102603
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi Javi Navarrete,

    Thank you for the additional information!

    You can use a CSS variable called --smart-scheduler-event-size to determine the height of the events cell in the timeline view and thus to determine when the ‘x more’ is displayed.

    Using the mentioned CSS variable:

    smart-scheduler {
        width: 100%;
        height: 100%;
        --smart-scheduler-event-size: 25px;
    }

    Let me know what you think about this!

    Please, do not hesitate to contact us if you have any additional questions.

    Best regards,
    Yavor Dashev

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

    in reply to: OnFilter Event (Blazor) #102595
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi TurricanDE,

    I have created another code snippet as a workaround to showcase you how to get the filter string from the Grid component

         List<string> stringConditions = new List<string> (){  
                    "EMPTY",
                    "NOT_EMPTY",
                    "CONTAINS",
                    "CONTAINS_CASE_SENSITIVE",
                    "DOES_NOT_CONTAIN",
                    "DOES_NOT_CONTAIN_CASE_SENSITIVE",
                    "STARTS_WITH",
                    "STARTS_WITH_CASE_SENSITIVE",
                    "ENDS_WITH",
                    "ENDS_WITH_CASE_SENSITIVE",
                    "EQUAL",
                    "NOT_EQUAL",
                    "EQUAL_CASE_SENSITIVE",
                    "NOT_EQUAL_CASE_SENSITIVE",
                    "NULL",
                    "NOT_NULL"
                  };
        private void filterEvent(Event ev)
            {
                GridFilterEventDetail filterEventDetail = ev["Detail"];
    
                string logicalOperator= "";
                
                if(filterEventDetail.Columns[0]["_filterState"]["logicalOperator"] == -1 ) 
                {
                    logicalOperator = "and";
                }
                else {
                    logicalOperator = "or";
                }
    
                int firstFilterComparison = filterEventDetail.Columns[0]["_filterState"]["firstFilterComparison"];
                string firstFilterValue = filterEventDetail.Columns[0]["_filterState"]["firstFilterValue"];
                int secondFiltercomparison= filterEventDetail.Columns[0]["_filterState"]["secondFilterComparison"];
                string secondFilterValue= filterEventDetail.Columns[0]["_filterState"]["secondFilterValue"];
               
                Console.WriteLine(stringConditions[firstFilterComparison] + " " + firstFilterValue+ " "+ logicalOperator+ " " + stringConditions[secondFiltercomparison]  + " " + secondFilterValue); 
              
            }

    Let me know what you think!

    Please, do not hesitate to contact us if you have any additional questions.

    Best regards,
    Yavor Dashev

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

    in reply to: Change row height of the time line month view #102594
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi Javi Navarrette,

    The height of the rows depends on the height of the SmartScheduler when you use it in ‘month’ view.

    Basically if you set the height of the Scheduler component it will affect the height of the rows itself.

    For example like in the following CSS code snippet:

    .smart-scheduler {
        width: 100%;
        height: 25%;
    }
    

    Let me know if this suits 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/

    in reply to: OnFilter Event (Blazor) #102591
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi TurricanDE,

    I have prepared a quick code snippet on how to achieve the functionality that you need.

        private void filterEvent(Event ev)
            {
                GridFilterEventDetail filterEventDetail = ev["Detail"];
    
                Console.WriteLine(filterEventDetail.Data[0].filter.filters[0]);
                Console.WriteLine(filterEventDetail.Data[0].dataField);
            }
    

    Let me know what you think!

    Please, do not hesitate to contact us if you have any additional questions.

    Best regards,
    Yavor Dashev

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

    in reply to: Issue with the PageSizeSelector Dropdown (Blazor) #102585
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi TurricanDE,

    This behavior is an issue and I have added a work item for this use case and we will work to fix it as soon as possible.

    Thank you for showcasing this issue as this helps improve our components constantly!

    Please, do not hesitate to contact us if you have any additional questions.

    Best regards,
    Yavor Dashev

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

    in reply to: Columns property remains in its initial state (Blazor) #102553
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi TurricanDE,

    Thank you for reporting this behavior and I will add a work item for this and we will consider this for future development.

    Also I would like to thank you for reporting this behavior as it helps us improve our products constantly.

    Please, do not hesitate to contact us if you have any additional questions.

    Best regards,
    Yavor Dashev

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

    in reply to: Cardview combo #102550
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi VAISHNAVI P,

    You can use the formatFunction property to insert a dropdownlist component into the SmartCardView card.

    I have prepared a code snippet on how to achieve this:

     columns: [
                    { label: 'First Name', dataField: 'firstName', icon: 'firstName',
                        formatFunction: function (settings) {
                            settings.template = 

    <div>
    <div id=”${settings.value}container”>${settings.value}</div>
    <smart-drop-down-list id=”${settings.value}” selected-indexes=”[0]”>
    <smart-list-item value=”1″>Name 1</smart-list-item>
    <smart-list-item value=”2″>Name 2</smart-list-item>
    </smart-drop-down-list>
    <div>`;
    }
    },
    `
    Let me know if this 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/

    in reply to: Suppress the delete command in the header (Blazor) #102543
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi TurricanDE,

    This functionality is not supported at the time being when you have the Selection enabled for the Smart.Blaor.Grid component.

    However I will add this for future development in order to suppress this behavior if needed.

    Please, do not hesitate to contact us if you have any additional questions.

    Best regards,
    Yavor Dashev

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

    in reply to: Dynamic columns (Blazor) #102539
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi TurricanDe,

    Yes, I confirm this behavior and it happens because when you add the new column the Smart.Blazor.Grid ‘refreshes’ the columns layout in order to add the new columns, although the sorting and filtering functionalities are kept, the icons are removed.

    I will add a work item for this case to be evaluated/resolved.

    Please, do not hesitate to contact us if you have any additional questions.

    Best regards,
    Yavor Dashev

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

    in reply to: Grid Pre-Selected Row #102538
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi Matias,

    There is a bit difference between using a row with the select method and when its done through user interaction and the main difference is that the user interaction set an focus attribute on the row.

    Anyway you can achieve this functionality and I have created a quick code snippet on how to achieve this:

            this.grid.select(0);
            setTimeout(() => {
                let row:any = document.querySelectorAll('smart-grid-row')[0];
                row.setAttribute('focus', '')
            }, 500);
    

    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/

    in reply to: Add items to DropdownList dynamically (Blazor) #102535
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi TurricanDE,

    I have tested the Smart.Blazor.DropDownList and its functionalities regarding adding items or updating and there appears to be some issue with them.

    That is why I have added a work item for this use case and we will work to fix as soon as we are able to.

    I would like to thank you for reporting this use case as it helps us improve our components constantly.

    Please, do not hesitate to contact us if you have any additional questions.

    Best regards,
    Yavor Dashev
    Smart UI Team
    https://www.htmlelements.com/

    in reply to: Date Column Format #102527
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi Matias Galante,

    For this purpose you can use the formatFunction property of the column like in the following code snippet to achieve the functionality that you need:

            { label: 'Time of Purchase', dataField: 'timeOfPurchase', width: 500,
                formatFunction: function(settings) {
                    const formatedDate = new Smart.Utilities.DateTime(settings.value).toString('MM/dd/yyyy ');
                    settings.template= <code><div> ${formatedDate}</div></code>
                }
            },

    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/

    in reply to: Dynamic columns (Blazor) #102526
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi TurricanDE,

    When you set GridColumn newColumn = new GridColumn(){ Label = columnsList[i], DataField = columnsList[i], SortOrder = GridColumnSortOrder.Desc }; it only sorts the cells intially when they are loaded, however if you want to have the Sorting and Filtering functionalities I have modified the code example from my previous reply:

        <Grid DataSourceSettings="DataSettings" @ref="grid" DataSource="dataRecords" Columns="@columns"  Sorting="@sorting" Filtering="@filtering"></Grid>
    
            <div class="options">
                <div class="caption">Settings</div>
                <div class="option">
                    <Button Disabled="@addColumnBtnDisabled" OnClick="AddColumn">Add Column</Button>
                </div>
                <div class="option">
                    <Button Disabled="@removeLastColumnBtnDisabled" OnClick="RemoveLastColumn">Remove Last Column</Button>
                </div>
                <div class="option">
                    <Button Disabled="@removeFirstColumnBtnDisabled" OnClick="RemoveFirstColumn">Remove First Column</Button>
                </div>
                <div class="option">
                    <Button Disabled="@updateFirstColumnBtnDisabled" OnClick="UpdateFirstColumn">Update First Column Header</Button>
                </div>
            </div>
        }
    </Example>
    
    @code {
        Grid grid;
        GridSorting sorting = new GridSorting()
        {
            Enabled = true,
            Mode = GridSortingMode.Many
        };
        GridFiltering filtering = new GridFiltering()
        {
            Enabled = true,
        };
        GridDataSourceSettings DataSettings = new GridDataSourceSettings()
        {   
            DataFields = new List<GridDataSourceSettingsDataField>()
                {
                new GridDataSourceSettingsDataField()
                {
                    Name = "Id",
                    DataType = GridDataSourceSettingsDataFieldDataType.Number
                },
                  new GridDataSourceSettingsDataField()
                {
                    Name = "Area",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                },
                    new GridDataSourceSettingsDataField()
                {
                    Name = "Population_Urban",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                },
                    new GridDataSourceSettingsDataField()
                {
                    Name = "Population_Rural",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                },
                    new GridDataSourceSettingsDataField()
                {
                    Name = "Population_Total",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                },
                    new GridDataSourceSettingsDataField()
                {
                    Name = "GDP_Agriculture",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                },
                new GridDataSourceSettingsDataField()
                {
                    Name = "GDP_Industry",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                },
                 new GridDataSourceSettingsDataField()
                {
                    Name = "GDP_Services",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                }, 
                new GridDataSourceSettingsDataField()
                {
                    Name = "GDP_Total",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                }
    
            }
        }; 
        bool addColumnBtnDisabled;
        bool removeLastColumnBtnDisabled;
        bool removeFirstColumnBtnDisabled;
        bool updateFirstColumnBtnDisabled;
    
        List<GridColumn> columns = new List<GridColumn>()
    {
            new GridColumn()
            {
                DataField = "Country",
                Label = "Country",
    
            },
            new GridColumn()
            {
                DataField = "Area",
                Label = "Area"
            },
            new GridColumn()
            {
                DataField = "Population_Rural",
                Label = "Population_Rural"
            },
            new GridColumn()
            {
                DataField = "Population_Total",
                Label = "Population_Total"
            },
            new GridColumn()
            {
                DataField = "GDP_Total",
                Label = "GDP_Total"
            }
        };
    
        private List<CountryRecord> dataRecords;
    
        protected override void OnInitialized()
        {
            base.OnInitialized();
            dataRecords = dataService.GenerateCountriesData();
        }
    
        private string[] columnsList = new string[]
        {
                "Id",
                "Country",
                "Area",
                "Population_Urban",
                "Population_Rural",
                "Population_Total",
                "GDP_Agriculture",
                "GDP_Industry",
                "GDP_Services",
                "GDP_Total"
        };
    

    For your other question I will further investigate this behavior.

    Please, do not hesitate to contact us if you have any additional questions.

    Best regards,
    Yavor Dashev

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

    in reply to: Toolti position #102519
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi tullio0106@live.it,

    For this scenario when you have a large number of characters in your tooltip as a solution it will be best to set a width to the tooltip which when I tested the tooltip seems like the most viable solution.
    You can set the width of the tooltip using CSS: 
     

    smart-tooltip{        
        width: 50%;    
    }
    

    Let me know what you think!

    Please, do not hesitate to contact us if you have any additional questions.

    Best regards,
    Yavor Dashev

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

    in reply to: Dynamic columns (Blazor) #102516
    Yavor Dashev
    Participant
    Up
    0
    Down

    Hi TurricanDE,

    I have found the source of the issue and also modified the code example so that it shows the cells populated with data.
    In your razor file:

    <Example Name="Grid">
        <p>
            Grid Column CRUD example.Grid Columns can be added, updated or deleted the same way you work with basic Javascript Arrays.
            Here, we demonstrate how to use the Smart Grid API to update, remove the first or last column and add a new column,
        </p>
    
        @if (dataRecords == null)
        {
            <p><em>Loading...</em></p>
        }
        else
        {
            <Grid DataSourceSettings="DataSettings" @ref="grid" DataSource="dataRecords" Columns="@columns"></Grid>
    
            <div class="options">
                <div class="caption">Settings</div>
                <div class="option">
                    <Button Disabled="@addColumnBtnDisabled" OnClick="AddColumn">Add Column</Button>
                </div>
                <div class="option">
                    <Button Disabled="@removeLastColumnBtnDisabled" OnClick="RemoveLastColumn">Remove Last Column</Button>
                </div>
                <div class="option">
                    <Button Disabled="@removeFirstColumnBtnDisabled" OnClick="RemoveFirstColumn">Remove First Column</Button>
                </div>
                <div class="option">
                    <Button Disabled="@updateFirstColumnBtnDisabled" OnClick="UpdateFirstColumn">Update First Column Header</Button>
                </div>
            </div>
        }
    </Example>
    
    @code {
        Grid grid;
    
        GridDataSourceSettings DataSettings = new GridDataSourceSettings()
        {   
            DataFields = new List<GridDataSourceSettingsDataField>()
                {
                new GridDataSourceSettingsDataField()
                {
                    Name = "Id",
                    DataType = GridDataSourceSettingsDataFieldDataType.Number
                },
                  new GridDataSourceSettingsDataField()
                {
                    Name = "Area",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                },
                    new GridDataSourceSettingsDataField()
                {
                    Name = "Population_Urban",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                },
                    new GridDataSourceSettingsDataField()
                {
                    Name = "Population_Rural",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                },
                    new GridDataSourceSettingsDataField()
                {
                    Name = "Population_Total",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                },
                    new GridDataSourceSettingsDataField()
                {
                    Name = "GDP_Agriculture",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                },
                new GridDataSourceSettingsDataField()
                {
                    Name = "GDP_Industry",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                },
                 new GridDataSourceSettingsDataField()
                {
                    Name = "GDP_Services",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                }, 
                new GridDataSourceSettingsDataField()
                {
                    Name = "GDP_Total",
                    DataType = GridDataSourceSettingsDataFieldDataType.String
                }
    
            }
        }; 
        bool addColumnBtnDisabled;
        bool removeLastColumnBtnDisabled;
        bool removeFirstColumnBtnDisabled;
        bool updateFirstColumnBtnDisabled;
    
        List<GridColumn> columns = new List<GridColumn>()
    {
            new GridColumn()
            {
                DataField = "Country",
                Label = "Country",
    
            },
            new GridColumn()
            {
                DataField = "Area",
                Label = "Area"
            },
            new GridColumn()
            {
                DataField = "Population_Rural",
                Label = "Population_Rural"
            },
            new GridColumn()
            {
                DataField = "Population_Total",
                Label = "Population_Total"
            },
            new GridColumn()
            {
                DataField = "GDP_Total",
                Label = "GDP_Total"
            }
        };
    
        private List<CountryRecord> dataRecords;
    
        protected override void OnInitialized()
        {
            base.OnInitialized();
            dataRecords = dataService.GenerateCountriesData();
        }
    
        private string[] columnsList = new string[]
        {
                "Id",
                "Country",
                "Area",
                "Population_Urban",
                "Population_Rural",
                "Population_Total",
                "GDP_Agriculture",
                "GDP_Industry",
                "GDP_Services",
                "GDP_Total"
        };
    
        private void AddColumn()
        {
            for (int i = 3; i < columnsList.Length; i++)
            {
                bool alreadyAdded = false;
    
                for (int j = 0; j < columns.Count; j++)
                {
                    if (columns[j].Label == columnsList[i])
                    {
                        alreadyAdded = true;
                        break;
                    }
                }
    
                if (alreadyAdded)
                {
                    continue;
                }
    
                GridColumn newColumn = new GridColumn(){ Label = columnsList[i], DataField = "GDP_Services" };
             
    
                columns.Add(newColumn);
                grid.Columns = new List<GridColumn>() { }; //TODO: remove
             
                grid.Refresh();
                break;
            }
    
            UpdateButtonsDisabledState();
        }

    The issue was caused because when you don’t set the DataFields for the Grid by default the DataFields are set by the Grid itself and are loaded only the DataFields which are initially loaded.That is why you need to define all the DataFields which are going to be add in order the cells to be populated with the corresponding data.

    Let me know what you think!

    Please, do not hesitate to contact us if you have any additional questions.

    Best regards,
    Yavor Dashev

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

Viewing 15 posts - 1 through 15 (of 36 total)