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.
Syncfusion Feedback

dynamically resize gantt control without reload all page

Thread ID:

Created:

Updated:

Platform:

Replies:

124117 May 18,2016 06:25 AM May 25,2016 12:05 AM JavaScript 6
loading
Tags: ejGantt
Aza
Asked On May 18, 2016 06:25 AM

Hi, 
When trying Div size altering, changes only upper side of gantt control and internal elements dont change (picture is shown below).
The question is how to activate function or event in order to update Gantt visually without refreshing the page. 
How to update Gantt manually so it will correspond to div size . In project i using angular route.
It is the div where placed gantt control "  <div id="GanttContainer" style="height:450px; width:100%" />"
Thanks!

Attachment: gantt_question_e147c550.rar

Aza
Replied On May 18, 2016 02:48 PM

if i set  enableResize: true, when div resize i get an error
"ej.web.all.min.js:10 Uncaught ejGanttChart: methods/properties can be accessed only after plugin creation
Error: ejGanttChart: methods/properties can be accessed only after plugin creation"

Jonesherine Stephen [Syncfusion]
Replied On May 19, 2016 08:49 AM

Hi Aza, 
Thanks for contacting Syncfusion support. 
Please find the responses for the queries below: 
Query1: if i set enableResize: true, when div resize i get an error 
"ej.web.all.min.js:10 Uncaught ejGanttChart: methods/properties can be accessed only after plugin creation
Error: ejGanttChart: methods/properties can be accessed only after plugin creation",
When trying Div size altering, changes only upper side of gantt control and internal elements dont change 
 
Solution:We regret for the inconvenience caused. 
We have analysed the reported issue with our sample. We are unable to reproduce the issue. Can you please revert us by modifying the sample based on your application along with the replication procedure? This would be helpful for us to serve you. 
Query2: The question is how to activate function or event in order to update Gantt visually without refreshing the page.  
How to update Gantt manually so it will correspond to div size. In project i using angular route. 
It is the div where placed gantt control " <div id="GanttContainer" style="height: 450px; width: 100%" />" 
Solution:  
We can change the size settings dynamically using the sizeSettings Properties. 
Using click event we can change the “sizeSettings” dynamically by assigning its “height” and “width” in model. 
Please find the code snippet below: 
<button onclick="size()" style="margin-bottom:10px">click</button> 
                    <div id="angulargantt"  
ej-gantt e-datasource="data"  
e-toolbarsettings="toolbarsettings" 
e-enableresize="true"  
style="width:100%;height:450px;"> 
                </div> 
  <script> 
              function size() { 
            //To change the height and width dynamically using sizeSettings 
            var gantt = $("#angulargantt").data("ejGantt"); 
            gantt.model.sizeSettings.height = "80%"; 
            gantt.model.sizeSettings.width = "80%"; 
            gantt.windowResize(); 
        } 
    </script> 
We have also prepared a sample for your reference. Please find the sample in the following URL. 
Please let us know if you need more information on this.
Regards,
Jone sherine P S
 


Aza
Replied On May 20, 2016 03:59 AM

Thank you for help to solve the problem. But still drawing in the monitors with a diagonal of 22 going awry. In monitors with a diagonal of 15-19 takes place normally. Days of the week are displaced.
Please explain why occurs so, and how to resolve this issue?
Thank you!

Attachment: _1e44d23f.rar

Mahalakshmi Karthikeyan [Syncfusion]
Replied On May 23, 2016 07:35 AM

Hi Aza, 
Sorry for the inconvenience, 
We have tested the reported behavior with the mentioned screen resolution (22` diagonal) but we were not able to reproduce the issue. Please find the sample for this from the following link. 
If you still facing any issues then please get back to us by modifying this sample along with the replication procedure to reproduce it. 
Regards, 
Mahalakshmi K. 


Aza
Replied On May 24, 2016 06:19 AM

Thanks guys for the quick response, I'll check my example again

Mahalakshmi Karthikeyan [Syncfusion]
Replied On May 25, 2016 12:05 AM

Hi Aza, 
Thanks for the update. 
Please let us know if you need further assistance on this. 
Regards, 
Mahalakshmi K. 


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.

Warning Icon 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.Close Icon

;