Home/ Questions/Q 9155873
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-17T12:40:23+00:00

I have seen many question about ‘JavaScript works only on alert’, but the answers

  • 0

I have seen many question about ‘JavaScript works only on alert’, but the answers are specific to those question only. I am using Kendo Calender and want to highlight specific dates from the value in the database. The below code works fine only when an alert is written.Kindly help: 

 var duedates = [];
     function GetDueDates() {
                     $.ajax({
                     type: "POST",
                     url: "ChartBinder.asmx/GetDueDates",
                     data: '{}',
                     contentType: "application/json; charset=utf-8",
                     dataType: "json",
                     success: function (msg) {
                         duedates = $.parseJSON(msg.d);      
                     },
                     error: function (msg) {    
                         alert("error");
                     }    
                 });
               }


  $(document).ready(function () {
               GetDueDates();

//Functionality works when alert is inserted here..

               var today = new Date();
               $("#calendar").kendoCalendar({
                   change: onChange,
                   navigate: onNavigate,
                   value: today,
                   dates: duedates,
                   month: {
                       // template for dates in month view
                       content: '# if ($.inArray(+data.date, data.dates) != -1) { #' +
                                    '<div class="' +
                                           "dataexist" +
                                             '"></div>' +
                                 '# } #' +
                                 '#= data.value #'
                   },
                   footer: "Today - #=kendo.toString(data, 'd') #"

               });          

           $(document).find("#panelbar").kendoPanelBar({
               expandMode: "single"
           });
       });
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Got the Solution: Changed the code as follows:

    var duedates = [];       
    function GetDueDates() {
             $.ajax({
             type: "POST",
             url: "ChartBinder.asmx/GetDueDates",
             data: '{}',
             contentType: "application/json; charset=utf-8",
             dataType: "json",
             success: function (msg) {
                 duedates = $.parseJSON(msg.d);                  
                  },
             error: function (msg) {    
                 alert("error");
             }    });
      }

     $(document).ready(function () {
         GetDueDates();
         setTimeout(function () { loadCalender(); }, 100);
         $(document).find("#panelbar").kendoPanelBar({
             expandMode: "single"
         });
         });


     function loadCalender() {
         var today = new Date();
         $("#calendar").kendoCalendar({
             change: onChange,
             navigate: onNavigate,    
             value: today,
             dates: duedates,
             month: {
                 // template for dates in month view
                 content: '# if ($.inArray(+data.date, data.dates) != -1) { #' +
                                                 '<div class="' +
                                                        "dataexist" +
                                                          '"></div>' +
                                              '# } #' +
                                              '#= data.value #'
             },
             footer: "Today - #=kendo.toString(data, 'd') #"
             });    
     }
    • 0