Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #101639
    Dark Beccio
    Member

    hi, is it possible to add such option in default filter row for string? (Contains “this” And “this”)
    actual options are:
    Contains
    Does not contain
    Starts with
    Ends with
    Equal
    Clear Filter
    ty.
     

    #101641
    yavordashew
    Member

    Hi Dark Beccion,
    The default filter row does not support the functionality you want to achieve.
    However you can add similar functionality in several ways.
    You can do it programmatically for example like this :

    filtering: {
        enabled: true,
        filter: [
            ['firstName', 'contains Andrew or contains Nancy'],
        ]
    }

    Or one way is to have filter panel enabled like in this demo https://www.htmlelements.com/demos/grid/filtering-panel/.
    And third solution is to have custom filterEditor in the column to achive this.
    I have used this demo for base example https://www.htmlelements.com/demos/grid/filtering-row-custom-editor/
    And add the filterEditor in the column :

    
      columns: [
                    {
                        label: 'First Name', dataField: 'firstName',filterEditor: {
                            template: '<smart-input drop-down-button-position="right" placeholder="Azienda" style="border-radius: 0px; border: none; width: 100%; height:100%"></smart-input>',
                            onInit(column, editor) {
                            const input = editor.querySelector('smart-input');
                            input.addEventListener('change', () => {
                            if (input.value === '') {
                                grid.clearFilter(); // if the use enters empy value the filtering is cleared
                            } else {
                                if ( input.value.indexOf(' ') >= 0 ){
                                    let inputValue = input.value.split(' '); //split the values where the whitespase is
                                    grid.addFilter('firstName' , "contains "+inputValue[0]+" or equal "+inputValue[1]+"")
                                }else {
                                    column.filter = 'equal "' + input.value.trim() + '"';
                                }
                            }
                            });
                            }
                            }},
    

    Hope one of these solutions 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/

Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.