Hello,
I’d like to display the grid in a jQuery UI dialog, just like the below.
It almost works; however, the text in the filter text box and select box disappears.
Here is the code to reproduce my issue.
https://snippet.dhtmlx.com/zv2km0ga
My environment:
Regards.
Hello @sengokyu,
Thank you for the detailed description of the issue and the provided demo.
It occurs because your custom styles targeting the select element:
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
font-family:Verdana,Arial,sans-serif;
font-size:1em
}
Where 1em causes element size lost (the behavior may be different based on browser).
You can fix it by removing select from custom styles, or by changing the way to set height:
.ui-widget select{
font-family:Verdana,Arial,sans-serif;
font-size:14px; // or rem/suite css variable usage
}
Here is an example:
https://snippet.dhtmlx.com/ogdryvsp
It’s just suggestions, and while you know what causes the issue - you may choose any preferred way to avoid it.
Kind regards,
Hello Siarhei,
Thank you for the answer. That really helped.