How to resolve the alignment related issues when render the FileExplorer component in Dialog Modal?
The FileExplorer component elements are rendered based on parent element dimensions or FileExplroer rendering element dimensions. When rendering FileExplorer component inside the Dialog Modal, the dimensions are not properly updated in FileExplorer element. So, the FileExplorer component elements are not aligned properly. You can resolve this kind of problems using the adjustSize method of FileExplorer component. The following code sample demonstrates how to resolve the alignment related issues when rendering the FileExplorer component in Dialog Modal.
@{Html.EJ().Dialog("modal").ContentTemplate(@<div>
@Html.EJ().FileExplorer("fileExplorer").Path("http://js.syncfusion.com/demos/ejServices/Content/FileBrowser/").AjaxAction(@Url.Content("http://js.syncfusion.com/demos/ejServices/api/FileExplorer/FileOperations")).IsResponsive(true).Width("100%").MinWidth("150px").Layout(LayoutType.Tile)
</div>).EnableModal(true).Width(500).ShowOnInit(false).ClientSideEvents(evt => evt.Open("onDialogOpen").Close("onDialogClose")).Render();
function onDialogOpen() {
var fileExplorerObj = $("#fileExplorer").data("ejFileExplorer");
fileExplorerObj.adjustSize();
}
