We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

Rendered issue in Tab

Thread ID:

Created:

Updated:

Platform:

Replies:

131867 Aug 1,2017 03:03 AM Aug 7,2017 02:45 AM ASP.NET MVC 3
loading
Tags: FileExplorer
Jacob
Asked On August 1, 2017 03:03 AM

Hello,

I found the FileExplorer will be rendered inside the hidden element of tab control at first.

So when I use the Tab control, it will have a issue that the FileExplorer will not be updated properly.

Here is the code:

    @Html.EJ().Tab("Tab").Items(data =>
{

//...

data.Add().ID("File").Text("File").ContentTemplate(@<div>

    @*@(Html.EJ().FileExplorer("fileExplorer")
            .Height("600px")
            .Width("100%")
            .IsResponsive(true)
            .MinWidth("100%")
            .EnableResize(true)
            .Path("http://js.syncfusion.com/demos/ejServices/Content/FileBrowser/")
            .AjaxAction("http://js.syncfusion.com/demos/ejServices/api/FileExplorer/FileOperations")
            .AjaxSettings(settings =>
                settings.Read(read =>
                    read.Url("http://js.syncfusion.com/demos/ejServices/api/FileExplorer/FileOperationsCors")
            .DataType("jsonp")
            ))
        )*@

    @Html.Action("PartialFilesIndex", "Files")

    </div>);
}

This worked well if the FileExplorer be put at the first Tab page, but at the other Tab page it will not success.  #(Please refer to the 01.png)

When I change mine Google Chorme browser size(like F11), it will refresh and worked but it still not worked well. #(Please refer to the 02.png)

Even if I use Syncfusion online demo code to replace mine PartialView the same issue still exist.

My english is not that good because english is not my first language so forgive me if i make some mistakes.

Thank you so much.

Best Regards.

Attachment: pics_cda9ffc8.zip

Kaviyarasu Sivasenapathi [Syncfusion]
Replied On August 2, 2017 11:37 AM

Hi Jacob,  
 
Thanks for using Syncfusion products.  
 
We have analyzed your query (“Rendered issue in Tab). You can achieve your requirement by calling “adjustSize()” method of FileExplorer component during the “itemActive” event of Tab component. Please refer the below code block.  
 
[CSHTML

@{ 
    ViewBag.Title = "Tab"; 
    Layout = "~/Views/Shared/_Layout.cshtml"; 
} 
<h2>Tab Default:</h2> 
<br/> 
<div id = "ControlRegion"> 
     <div style="width: 500px"> 
        @{Html.EJ().Tab("defaultTabs").ClientSideEvents(evt => evt.ItemActive("currentTab")).ShowCloseButton(false).EnablePersistence(false).HeaderPosition(HeaderPosition.Top).Items(data => 
           { 
               data.Add().ID("steelman").Text("Tab 1").ContentTemplate(@<div> 
                   
               </div>); 
               data.Add().ID("woldwar").Text("Tab 2").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.Grid).EnableResize(true).Height("600px") 
               </div>); 
               
           }).Render();} 
    </div> 
</div> 
 
[script] 
 
<script> 
    function currentTab() { 
        var fileExplorerObj = $("#fileExplorer").data("ejFileExplorer"); 
        fileExplorerObj.adjustSize(); 
    } 
</script> 

For your convenience, we have attached the sample below.  
 
 
To know more details about adjustSize() method, please refer the following documentation link  
 
 
We have already fixed this issue and included in Essential studio 15.2.0.46 version. So please use your essential studio version to 15.2.0.46 and above. 
 
Please let us know whether the provided sample helps you to achieve your requirement. If not, get back to us with more information we will assist you gladly.    
  
Regards,  
Kaviyarasu S  



Jacob
Replied On August 4, 2017 02:52 AM

Hi Kaviyarasu,

Thanks a lot, this issue was be solved.

But I found other issue at Tabs control, I will post it in the Tabs forum.

Best regards.


Kaviyarasu Sivasenapathi [Syncfusion]
Replied On August 7, 2017 02:45 AM

Hi Jacob, 
Thanks for your update. 
Please let us know if you need further assistance on this. 
 
Regards, 
Kaviyarasu S   


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;