What's causing the filter menu container to drop all the way down.

adding screen shot

screenshot

Hi David,

This is not a known issue. Is it possible for you to create a Kendo Dojo example that isolates the issue so I can examine it and investigate what is going wrong?

Looking forward to your reply.

Regards,
Alexander Valchev
Telerik

It's a little tough since I don't know what causes it.  It does seem like the grid calculates the size of the window and populates in the the DIV container with class "k-animation-container".  In the following screen shot, the 767px height is what is set by the grid.  The next screen shots shows the correct height that I edited.

Can you give me clues how that height is determined?  Setting it to Auto collapsed the DIV and thus no border.

 

 

Hello David,

The height is calculated based on the available screen space and anchor position. If you are interested you may examine the src/kendo.popup.js and src/kendo.filtermenu.js.

Issue are likely to occur if the parent container is hidden (or being animated and the animation is not finished yet).

Regards,
Alexander Valchev
Telerik

Is there something I need to set if I handled my own filter menu options.  I also use a javascript function to handle the AJAX call for the filter options.

 

var dataSource =
            {
                transport: {
                    read: function (options) {                        
                        $.ajax({
                            type: "POST",
                            url: column.filterUrl,
                            datatype: "json",
                            contentType: "application/json; charset=utf-8",
                            data: data,   // ParameterMap does not work when transport methods are using functions
                            success: function (result) {                            
                                if (result.d.Success) {
                                    // notify the DataSource that the operation is complete
                                    options.success(result.d.Data);
                                } else {
                                    toastr.error("There was an issue loading the filter options.", "Error");
                                    options.error(result);
                                }
                            }
                        });                       
                    }                   
                }
            };

Is there a JS function for me to call to tell it to resize?  

I found the issue.  the FORM was set to height of 100% in a custom CSS that got applied for the filter menus since it has a form in it.