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

resources extra column

Thread ID:

Created:

Updated:

Platform:

Replies:

124877 Jul 6,2016 01:21 AM UTC Jul 12,2016 11:14 AM UTC JavaScript 9
loading
Tags: ejSchedule
David Barrett
Asked On July 6, 2016 01:21 AM UTC



I am using the schedule with a single layer of resources, and I am trying to style the resources a bit and there is an extra <td> in front of the names I want to remove or shrink to nothing. I assumed it was for a caret drop down if needed but I tried setting up grouped resources and that column is still there before the row. 

it is the <td style="width:25px;height:50px"></td> setting just after each <tr class="e-horizontresheaderdiv"> and before the <td> that holds the name of the resource (the height is set for my cell height)

I tried to run a jquery statement  $('.e-horizontresheaderdiv',"#calendar-area").each(function(){$(this).find('td:first').remove();}); after the schedule was created to remove them but there is no method I can find that runs after the schedule is completely loaded. I tried create (which was not even in docs) which happens apparently too early. 

Is there a event that I can use after the schedule is created or another way that I can remove or  adjust that column

Thanks

Karthigeyan Krishnamurthi [Syncfusion]
Replied On July 6, 2016 12:04 PM UTC

Hi David,   
   
Thank you for contacting Syncfusion support.   
   
We recommend not to remove any default td(s) as it will result in CSS alignment problem. To customize the resource name, you can use the default Resource header template feature. We have prepared a sample for your requirement which can be viewed from the below link:   
   
Please visit the below link to know more about the feature.   
  
Regards,   
Karthigeyan   
 


David Barrett
Replied On July 6, 2016 11:10 PM UTC



Thank you for the advice but nothing I can do in the template will remove the 25px from the left which makes all my resources fall onto the next line because they are too long for the box with the extra 25px. And yes I know that I could make the box bigger but its already bigger than I want since there are so many resources I have to load and all the appointments they have.

It will cause no alignment issues as it is an enclosed table inside a td from above so the only thing it does is remove the 25px from the left which appear to do absolutely nothing for anything, since you never use that column for anything. I thought you might use it with grouped resources but no you don't you add the dropdown caret inside the resource box. 

So I will put a 5 second timer on the  create and take out those columns after the schedule loads and I will just have to adjust timer to make sure that calendar is actually created and on the page before it runs. 

Karthigeyan Krishnamurthi [Syncfusion]
Replied On July 7, 2016 11:57 AM UTC

Hi David,   
  
Thanks for your update.   
  
We have prepared the sample for your requirement “Need to shrink the td(s) width” which can be download from the following location:   
  
Create event will trigger during the initial load of the Scheduler. In that event function we have set the td’s width as 0px. Kindly refer to the following code example used in the above sample. 
<Code> 
function onCreate() { //this function will be called during the initial load of the Scheduler 
            $(".resemptytd").css("width", "0px"); // here td’s width is shrunk 
        } 
</Code> 

Regards, 
Karthigeyan 


David Barrett
Replied On July 7, 2016 04:13 PM UTC



Thanks for the reply.

Im kinda confused with that answer for a couple reasons

1. The TD im trying to (remove or set to 0px) has no class assigned to it so Im not sure how I would get there using the jQuery command for that class? 

2. I have already tried to use the create function to remove that TD and that event happens before the schedule is shown on the page, so no jquery functions on the schedule yet, Which is why I was asking if there was a function that happens after the schedule is shown on the page or if create is the last event to happen. 

Sellakumar [Syncfusion]
Replied On July 8, 2016 01:53 PM UTC

Hi David, 
We have prepared the sample for your requirement “Need to shrink the td(s) width” which can be download from the following location:  
Kindly refer to the following code example used in the above sample.  
<Code>  
     function onCreate() { //this function will be called during the initial load of the Scheduler  
          $('.e-horizontresheaderdiv').find('td:first-child').remove(); // here td’s is removed. 
     }  
</Code>  
Regards,  
Sellakumar

David Barrett
Replied On July 8, 2016 02:20 PM UTC



   Thanks for the reply. 

Did you run that sample you provided? Because it won't work. The theory of what your jquery command (from both replies) will work, but it will only work on a visible object. And at the time of the create function running, the scheduler is not visible on the page and therefore any jquery will not work on the object. Which comes back to the first question that I asked. 

Is there another function that runs later than create? 

I know how to remove or shirk the column, that is not the issue. It is getting it to run after the schedule is on the screen. I have been trying to find a function that runs late enough, otherwise I will have to setup a timer off the create function to run the jquery after 5 secs or something

Thanks for trying to help

Mahesh Palanisamy [Syncfusion]
Replied On July 11, 2016 05:31 PM UTC

Hi David, 

Thanks for your update. 

We regret to let you know that we are unable to reproduce the reported problem with “create” event and would like to let you know that the `create` event gets triggered commonly, after any of the control initially renders on the page. Likewise, the scheduler control too will render and become visible on the page – before this event triggers. Please check it here in the JS playground link –  

Please refer the screenshot below –  
 
If still the issue persists on your end, kindly try to reproduce the issue in the above mentioned JS playground link and revert back to us – so that we will check on this. 

Also, if the style doesn’t works within the “create” event – try with the following CSS,  

<Code> 
 
    <style type="text/css"> 
        .e-schedule .e-horizontresheaderdiv td:first-child 
        { 
            display: none; 
        } 
    </style> 
 
</Code> 
 
Kindly reproduce the issue in the provided link or else share the sample or code block, if the issue still persists on your end. 

Regards, 
Mahesh

David Barrett
Replied On July 11, 2016 05:47 PM UTC



Thanks for the reply,

  I think it is strictly a timing issue for the create event on my side, I unloaded all the appointments/resources from my calendar and it does indeed do the function like your example provides, but as I add in more appointments/resources then there is a timing delay that allows the jquery to run before the schedule is fully put to page. However that said I think the css solution (which I had not really thought of till you mentioned it) since that column reappears with every refresh of the view anyways so the create function I was using also needs to be added to the onActionComplete function as well, in order to ensure that your scripts don't add them back in there after I remove (or hide them). So I think my solution will be to go with the css solution that you sent as that seems to be the most complete and least destructive. 

If I have any issues with that solution I will let you know but thank you for the help and effort to solve the problem, it is very easy to work through issues with your staff.

Sellakumar [Syncfusion]
Replied On July 12, 2016 11:14 AM UTC

Hi David 
 
Thanks for your update.  
 
We are glad to hear that your reported problem got resolved. Please let us know, if you need any other assistance on this. 
 
Regards, 
Sellakumar 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

;