CODEWITHSUNDEEP
javascriptjquery
Ponnaveen S
Ponnaveen S

Reputation: 149

To load and initialize multiple JS plugins on specific page in jQuery

if ($(".section").length) {
  var script_arr = [
    'moment.js',
    'daterangepicker.js',
  ];
  $.getMultiScripts(script_arr);
}
$(function() {
  $('#date-picker').daterangepicker({
    "opens": "left",
    singleDatePicker: true,
    isInvalidDate: function(date) {
      var disabled_start = moment('09/02/2018', 'MM/DD/YYYY');
      var disabled_end = moment('09/06/2018', 'MM/DD/YYYY');
      return date.isAfter(disabled_start) && date.isBefore(disabled_end);
    }
  });
});

In the above code, I have loaded multiple scripts on specific page, but I'm unable to initialize those scripts properly.

Upvotes: 1

Views: 129

Answers (1)

cieunteung
cieunteung

Reputation: 1793

it is because daterangepicker.js not yet loaded, execute the script in callback or done() function.

if ($(".section").length) {
  var script_arr = [
    'moment.js',
    'daterangepicker.js',
  ];
  $.getMultiScripts(script_arr).done(function() {
    $('#date-picker').daterangepicker({
      "opens": "left",
      singleDatePicker: true,
      isInvalidDate: function(date) {
        var disabled_start = moment('09/02/2018', 'MM/DD/YYYY');
        var disabled_end = moment('09/06/2018', 'MM/DD/YYYY');
        return date.isAfter(disabled_start) && date.isBefore(disabled_end);
      }
    });
  });
}

Upvotes: 1

Related Questions