can't see the whole popup of the filter

1 Reply
2 Participants

Created by
LC Luis Carlos

Platform
jQuery

Platform
jQuery

Control
ejGrid

Created On
May 13, 2019 04:08 PM UTC

Last Activity On
May 14, 2019 09:08 AM UTC

Want to subscribe?
SIGN IN

Good evening.

I can't see the whole popup of the filter because the grid is over a dialog with z-index 9999 (see image). Could you give me any idea about how to fix this problem? Maybe the popup can show at the top of the filter icon?

I will be waiting for your reply, thank you in advance.

Regards, Luis Carlos.

1 Reply

VN Vignesh Natarajan Syncfusion Team May 14, 2019 09:08 AM UTC

Hi Luis,

Thanks for contacting Syncfusion Support.

Query#:- I can't see the whole popup of the filter because the grid is over a dialog with z-index 9999 (see image). Could you give me any idea about how to fix this problem?

From your query, we understand that you are facing issue while opening the excel filter in Grid when placed above the dialog. We are able to reproduce the reported issue at our end. To overcome the reported issue, kindly use any one of the below methods.

Solution#1:- We suggest you to modify the z-index value of the Grid excelFilter in the actionBegin event. so that it does not hide inside the dialog. Please refer to the code example

$(function () {

$("#Grid").ejGrid({

// the datasource "window.gridData" is referred from jsondata.min.js

dataSource: window.gridData.slice(0,7),

allowPaging: true,

allowFiltering: true,

enableHeaderHover: true,

actionBegin: "begin",

filterSettings: { filterType: "excel" },

columns: [

{ field: "OrderID", isPrimaryKey: true, headerText: "Order ID", textAlign: ej.TextAlign.Right, width: 75 },

. . .

actionBegin:function(args){

if(args.requestType=="filterbeforeopen"){

var proxy =this;

setTimeout(function(){

$("#" + proxy._id + args.columnType + "_excelDlg").css("z-index",11111)

},0)

}

})

});

</script>

Refer the below screenshot for the output

For your convenience we have prepared a sample which can be referred below

Sample: http://jsplayground.syncfusion.com/dxxvdqg3

Solution#2: Or you can also change the position of excel filter as you suggested. We can change the filter Dialog position by using actionComplete event of the Grid, when requestType as filterafteropen we have defined the style top for the excelFilter dialog.

Refer to the code example:-