Сочетание двух сценариев jquery для совместной работы

Question

У меня есть два сценария, и проблема в том, что функция check вызывается только при изменении состояния #hotel. Как я могу выполнить проверку функции, а в случае #hotel не изменяется.

 
var hotelMap = { hotel_a: 15, hotel_b: 5, hotel_c: 10 }; //Edw mporeis na allazeis to release period gia kathe ksenodoxeio 
$(function() { 
    $('#hotel').change(function() { 
    var selectVal = $('#hotel :selected').val(); 
    $("#from, #to").datepicker("option", "minDate", hotelMap[selectVal]); 
    }); 
     var dates = $('#from, #to').datepicker({ 
      defaultDate: "+1w", 
      changeMonth: true, 
      dateFormat: 'yy-m-d', 
      minDate: 15,//Episis edw prepei na mpainei to release period tou prwtou stoixeiou sth lista 
      numberOfMonths: 3, 
      onSelect: function(selectedDate) { 
       var option = this.id == "from" ? "minDate" : "maxDate"; 
       var instance = $(this).data("datepicker"); 
       var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings); 
       dates.not(this).datepicker("option", option, date); 
      } 
     }); 
    }); 

 
$(document).ready(check); 
      function check(){ 
       $('#from, #to, #hotel').bind('change', update); 
       $('#wait').show(); 
      } 
      function update(){ 
       var from=$('#from').attr('value'); 
       var to=$('#to').attr('value'); 
       var hotel=$('#hotel').attr('value'); 
       $.get('get_availability.php', {from: from, to:to, hotel:hotel}, show); 
      } 
      function show(avail){ 
       $('#wait').hide(); 
       $('#availability').html(avail); 
      } 

Answer 1

Вы можете использовать событие jQuery's trigger. Так что где-то в вашем коде, вы могли бы добавить к этому:

$('#hotel').trigger('change'); 

---

Edit:

Я обновляю demo ... Я добавил новое инициирующее событие под названием «обновление» в функции изменения и внутри функция datepicker. Затем я изменил вашу функцию check() для привязки к событиям обновления и размытия (по умолчанию размытие лучше работает в окне выбора даты).

Вот код, который я закончил с:

var hotelMap = { hotel_a: 15, hotel_b: 6, hotel_c: 10 }; 
$(function() { 
$('#hotel').change(function() { 
    // assign the value to a variable, so you can test to see if it is working 
    var selectVal = $('#hotel :selected').val(); 
    $("#from, #to").datepicker("option", "minDate", hotelMap[selectVal]); 
    $(this).trigger('update'); 
}); 

var dates = $('#from, #to').datepicker({ 
    defaultDate: "+1w", 
    changeMonth: true, 
    dateFormat: 'yy-m-d', 
    minDate: 10, 
    numberOfMonths: 1, 
    onSelect: function(selectedDate) { 
      var option = this.id == "from" ? "minDate" : "maxDate"; 
      var instance = $(this).data("datepicker"); 
      var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings); 
      dates.not(this).datepicker("option", option, date); 
      $(this).trigger('update'); 
      } 
}); 
}); 

$(function(){ 
$('#from, #to, #hotel').bind('update blur', function(){ 
    var from=$('#from').attr('value'); 
    var to=$('#to').attr('value'); 
    var hotel=$('#hotel').attr('value'); 
    $('#availability').html(hotel + ' : ' + from + ' -> ' + to); 
}); 
}) 

Answer 2

Перемещение функции во втором файле из документа готового (на уровне окна). В настоящий момент они привязаны только к событию, подготовленному к документу.

Затем вы можете вызывать функции из любого места (хотя вы можете поместить их в закрытие). Не имеет значения, в каком порядке загружаются файлы, поскольку функции сначала оцениваются.

По соображениям производительности лучше всего попробовать поставить этот код в один файл. Если это возможно, вы можете поместить функции вместе с кодом в один документ. Это, вероятно, лучшее решение.