Issues with angular directives and scheduler templates

6 posts, 0 answers
  1. SLM
    SLM avatar
    13 posts
    Member since:
    Oct 2011

    Posted 20 Jul Link to this post

    Hi,

    I have trouble with angular events such as ng-click when using scheduler groupHeaderTemplate and eventTemplate.
    The ng-click event is not fired.

    Samples:

    //Loading templates
    this.groupHeaderTemplate = <string>$templateCache.get(SchedulerPageController.groupHeaderTemplatePath);
    this.eventTemplate = <string>$templateCache.get(SchedulerPageController.eventTemplatePath);
     
    let options: kendo.ui.SchedulerOptions = kendo.ui.Scheduler.fn.options;
    options.groupHeaderTemplate = kendo.template(this.groupHeaderTemplate);
    options.eventTemplate = kendo.template(this.eventTemplate);

    Group Header template

    <div class="row" k-template>
        <div class="col-sm-7">
            <span><strong style="color: #=color#">#=text#</strong></span>
        </div>
        <div class="col-sm-4 text-right">
            <button class="btn btn-danger" ng-click="alert('test')"><i class="fa fa-times"></i></button>
        </div>
    </div>

    Event template

    <div class="movie-template">
        <img src="#= image #">
        <p>
            #: kendo.toString(start, "hh:mm") # - #: kendo.toString(end, "hh:mm") #
        </p>
        <h3>#: title #</h3>
        <a href="#= imdb #" ng-click="console.log('test')">Movie in IMDB</a>
    </div>

  2. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2172 posts

    Posted 22 Jul Link to this post

    Hi,

    I already answered to this query in duplicated support ticket created by you - #1051853 . Please keep in mind that it is highly recommended that you keep related questions in one support thread or a forum post, so that we can easily keep track of your support history and provide better answers in a shorter time.

    Regards,
    Vladimir Iliev
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  3. Kendo UI is VS 2017 Ready
  4. Jin
    Jin avatar
    4 posts
    Member since:
    Apr 2015

    Posted 28 Jul in reply to Vladimir Iliev Link to this post

    Hi Vladimir,

     

    Can you give me the link for this problem?

    I am facing the same problem, ng-click='myclicked()' in scheduler groupHeaderTemplate is not fired.

     

    function myController($q, $scope)

    {

           $scope.myclicked = function () {
               alert("myclicked on: ");
           };

     

          $scope.schedulerOptions = {
               .........

                groupHeaderTemplate: function () {
                    return "<button ng-click='myclicked()'>Click </button>";

               },

               .......

        };

    }

     

  5. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2172 posts

    Posted 29 Jul Link to this post

    Hi Jin,

    Please check the related answer below:

    Please note that currently the Scheduler does not support template directives for the group header template option - for more information you can check the Angular documentation:

    You can however share your idea at Kendo UI UserVoice to allow other users vote for it. All ideas are reviewed by our dev / PM team and included in next Kendo UI releases. 

     
    Regards,
    Vladimir Iliev
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  6. Jin
    Jin avatar
    4 posts
    Member since:
    Apr 2015

    Posted 31 Jul in reply to Vladimir Iliev Link to this post

    Is there a work around I could assign a click event handler to the checkbox in the group header?
  7. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3706 posts

    Posted 03 Aug Link to this post

    Hello Jin,

    The possible workaround is to wire the click events of the group header checkboxes with regular JavaScript. You can use for instance jQuery to find all checkboxes and and wire their clicks. The suggested logic can be implemented in the Scheduler dataBound event handler:

    http://docs.telerik.com/kendo-ui/api/javascript/ui/scheduler#events-dataBound

    Regards,
    Georgi Krustev
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
Back to Top
Kendo UI is VS 2017 Ready