1. Home
  2. Forum
  3. ASP.NET Core - EJ 2
  4. grid Editing and filtering Issue

grid Editing and filtering Issue

HI,
I have two queries regarding grid.
First when I try to restrict decimal value by following the tutorial given here. I am seeing textbox is duplicated. Sample is attached
Second. How can  give more then one filter in if clause in below mentioned code in highlight

var grid = document.getElementById('Grid').ej2_instances[0];
if (op == "myfilter") {
            grid.clearFiltering();
            grid.filterByColumn('field1', 'equal', 'Value1' OR  'field2', 'equal', 'Value2');
            $('#bdg3').addClass('badgeborderline');
            $('#bdg1,#bdg2,#bdg4').removeClass('badgeborderline');

Attachment: demonumberictextbox_2a545bd0.zip

5 Replies
BS Balaji Sekar Syncfusion Team February 25, 2020 04:56 PM UTC

Hi Muhammad, 
 
Greetings from syncfusion support. 
 
Query #1 : First when I try to restrict decimal value by following the tutorial given here. I am seeing textbox is duplicated. 
 
We are able to reproduce the reported problem in the attached sample and found that you are used style scripts with old version in the layout.cshtml. So we suggest you to update styles script with the latest version or use the cdn link to resolve the reported problem. Please refer the below link to update the EJ2 scripts in the application. 
 
 
Query #2 : How can  give more then one filter in if clause in below mentioned code in highlight 
 
The filterByColumn method is used to filter only one column in the grid. If you need to filter multiple columns in the grid we suggest you to use the API columns of filterSettings. Please refer the below code and sample to filter the multiple columns in the grid. 
 
 
 
<button onclick="myfunction()">Filter</button> 
<button onclick="myfunction1()">Clear Filter</button> 
<ejs-grid id="Grid" dataSource="@ViewBag.DataSource" toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })" allowFiltering="true"> 
    <e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true"></e-grid-editSettings> 
    <e-grid-columns> 
------ 
    </e-grid-columns> 
</ejs-grid> 
 
<script> 
    function myfunction(args) { 
        var grid = document.getElementsByClassName('e-grid')[0].ej2_instances[0]; 
// filtering multiple columns in the grid 
        grid.filterModule.filterSettings.columns = [ 
            { field: 'ShipCountry', operator: 'contains',value: 'den' }, 
            { field: 'EmployeeID', operator: 'equal', value: '2' } 
        ] 
    } 
 
    function myfunction1(args) { 
        var grid = document.getElementsByClassName('e-grid')[0].ej2_instances[0]; 
        grid.clearFiltering(); 
    } 
</script>  
 
 
Please get back to us if you need further assistance. 
 
Regards, 
Balaji Sekar.     


MT Muhammad Tassadaque Zia February 25, 2020 06:52 PM UTC

Thanks for the reply but i want to add or operator on same field with or operator for filtering like below
grid.filterModule.filterSettings.columns = [ 
            { field: 'ShipCountry', operator: 'contains',predicate: 'or', value: 'den' }, 
            { field: 'ShipCountry', operator: 'equal',predicate: 'or', value: 'den2' } 
        ] 

further my grid has excel filter settings and above code (without predicate) gives error 
@{
            List<object> filterColumns = new List<object>();
            filterColumns.Add(new { field = "ShipCountry", @operator = "equal", value = "den" });
        }
@*<e-grid-filterSettings type="Excel" columns="filterColumns"></e-grid-filterSettings>*@



RS Rajapandiyan Settu Syncfusion Team February 26, 2020 02:31 PM UTC

Hi Muhammad, 

Thanks for your update.  
 
Query 1 : i want to add or operator on same field with or operator for filtering like below 

Currently we are validating your requirement at our end. We will update the further details by tomorrow Feb 27th 2020. 
 
Until then we appreciate your patience. 
 
Regards, 
Rajapandiyan S.              


PK Prasanna Kumar Viswanathan Syncfusion Team February 27, 2020 05:08 PM UTC

Hi Muhammad, 
 
Thanks for your update. 
 
Query #1 : The idea was that you would provide me with the script in js. It gives me an error on the line: const intl: Internationalization = new Internationalization (); 
 
By using grid filtering methods we have filtered single value only in the column. This is the default behavior, So we can’t able to filter the multiple values in a same column. 
 
We have achieved your requirement as a workaround. In that we have created a query with predicates in which you can able to get the records as you expected. You can able to get those records by using grid method getCurrentViewRecords(). 
 
The queried data will be cleared in the grid by passing empty query to the grid. 
 
Please refer the sample and code example for more information. 
 
 

<button onclick="myfunction()">Filter</button> 
<button onclick="myfunction1()">Clear Filter</button> 
 
@*@{ 
    List<object> filterColumns = new List<object>(); 
    filterColumns.Add(new 
    { 
        field = "ShipCountry", 
        @operator = "contains", 
        value = "den", 
        matchCase = false 
    }); 
}*@ 
 
@{ 
    List<object> filterColumns = new List<object>(); 
    filterColumns.Add(new { field = "ShipCountry", matchCase = true, @operator = "startswith",  value = "b" }); 
} 
 
 
<ejs-grid id="Grid" dataSource="@ViewBag.DataSource" toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })" allowFiltering="true"> 
    <e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true"></e-grid-editSettings> 
    <e-grid-filterSettings type="Excel" ></e-grid-filterSettings> 
    <e-grid-columns> 
        <e-grid-column field="OrderID" headerText="Order ID" isPrimaryKey="true" textAlign="Right" width="100"></e-grid-column> 
        <e-grid-column field="CustomerID" headerText="Customer ID" type="string" width="120"></e-grid-column> 
        <e-grid-column field="EmployeeID" headerText="Employee ID" type="string" width="120"></e-grid-column> 
        <e-grid-column field="Freight" headerText="Freight" textAlign="Right" format="C2" editType="numericedit" width="120" 
                       edit="@(new { @params = new Syncfusion.EJ2.Inputs.NumericTextBox() { 
                ValidateDecimalOnType = true, 
                Decimals = 0, 
                Format = "N" 
               } 
       })"></e-grid-column> 
        <e-grid-column field="ShipCountry" headerText="Ship Country" width="150"></e-grid-column> 
    </e-grid-columns> 
</ejs-grid> 
 
<script> 
    function myfunction(args) { 
        var grid = document.getElementsByClassName('e-grid')[0].ej2_instances[0]; 
// create the predicate 
        var predicate = new ej.data.Predicate('EmployeeID', 'equal', 3); 
            predicate = predicate.or('EmployeeID', 'equal', 2); 
// get the records using predicate 
        grid.query = new ej.data.Query().where(predicate); 
 
    } 
 
    function myfunction1(args) { 
        var grid = document.getElementsByClassName('e-grid')[0].ej2_instances[0]; 
// to clear query 
        grid.query = new ej.data.Query() 
    } 
</script>  

 
Query #2: my grid has excel filter settings and above code (without predicate) gives error 
 
We are able to reproduce the reported issue at our end. We have confirmed and logged defect report for the same “Filtering is not working properly for the caseSensitive”. At Syncfusion, we are committed to fixing all validated defects (subject to technological feasibility and Product Development Life Cycle ) and including the defect fix in our next patch release which is expected to be rolled out on or before 11th March, 2020. 
 
Regards, 
Prasanna Kumar N.S.V 
 


RS Rajapandiyan Settu Syncfusion Team February 28, 2020 01:41 PM UTC

Hi Muhammad, 
 
Query #2: my grid has excel filter settings and above code (without predicate) gives error 

Please find below feedback link. You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this link.  


Regards, 
Rajapandiyan S.              


Loader.
Up arrow icon