jQuery DatePicker - «фальшивый» клик по загрузке страницы

Question

У меня быстрый вопрос о DatePicker пользовательского интерфейса jQuery.

Когда я загружаю страницу, defaultDate: 0 будет нормально работать с выбором даты текущего дня. Я хотел бы создать «поддельный» щелчок по дате, чтобы он выполнял мою функцию JavaScript и извлекал информацию из базы данных. Я пытался вызвать функцию при загрузке страницы, но это не сработало.

$(document).ready(function(){
    $("#datepicker").datepicker({ gotoCurrent: false,
          onSelect: function(date, inst) { ajaxFunction(date); },
          dateFormat: 'dd-mm-yy',
          defaultDate: 0,
          changeMonth: true,
          changeYear: true
          });
  });


//Browser Support Code
function ajaxFunction(date){
 var ajaxRequest;  // The variable that makes Ajax possible!

 try{
  // Opera 8.0+, Firefox, Safari
  ajaxRequest = new XMLHttpRequest();
 } catch (e){
  // Internet Explorer Browsers
  try{
   ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
   try{
    ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
   } catch (e){
    // Something went wrong
    alert("Your browser broke!");
    return false;
   }
  }
 }
 // Create a function that will receive data sent from the server
 ajaxRequest.onreadystatechange = function(){
  if(ajaxRequest.readyState == 4){
   var ajaxDisplay = document.getElementById('ajaxDiv');
   ajaxDisplay.innerHTML = ajaxRequest.responseText;
  }
 }
 var queryString = "?date=" + date;
 ajaxRequest.open("GET", "getDiary.php" + queryString, true);
 ajaxRequest.send(null); 
}

function ajaxAdd(){
 var ajaxRequest;  // The variable that makes Ajax possible!

 try{
  // Opera 8.0+, Firefox, Safari
  ajaxRequest = new XMLHttpRequest();
 } catch (e){
  // Internet Explorer Browsers
  try{
   ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
   try{
    ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
   } catch (e){
    // Something went wrong
    alert("Your browser broke!");
    return false;
   }
  }
 }
 var day1 = $("#datepicker").datepicker('getDate').getDate();
 var day2 = (day1 < 10) ? '0' + day1 : day1; 
 var month1 = $("#datepicker").datepicker('getDate').getMonth() + 1;
 var month2 = (month1 < 10) ? '0' + month1 : month1; 
 var year1 = $("#datepicker").datepicker('getDate').getFullYear();
 var year2 = (year1 < 1000) ? year1 + 1900 : year1;
 var fullDate = day2 + "-" + month2 + "-" + year2;
 var queryString = "?breakfast=" + diary1.breakfast.value;
 queryString = queryString + "&lunch=" + diary1.lunch.value;
 queryString = queryString + "&dinner=" + diary1.dinner.value;
 queryString = queryString + "&date=" + fullDate;
 ajaxRequest.open("GET", "addDiary.php" + queryString, true);
 ajaxRequest.send(null); 

 alert("Added value to database!");
 diary1.breakfast.value = "";
 diary1.lunch.value = "";
 diary1.dinner.value = "";
 ajaxFunction(fullDate);
}

Я вставил свой класс DatePicker и две используемые функции (одну для извлечения информации из базы данных и одну для хранения).

В основном я хочу отразить функцию onSelect: на DatePicker, но при первой загрузке страницы.

Спасибо!

Answer 1

Попробуйте что-то вроде этого:

$(document).ready(function(){
    $("#datepicker").datepicker({ gotoCurrent: false,
        onSelect: ajaxFunction,
        dateFormat: 'dd-mm-yy',
        defaultDate: 0,
        changeMonth: true,
        changeYear: true
    });
    ajaxFunction();
});

function ajaxFunction(date){
    if (!date){ 
        var d = $("#datepicker").datepicker('getDate'),
        date = $.datepicker.parseDate('dd-mm-yy',d);
    }
    $.ajax({
        url:"getDiary.php",
        type: "GET",
        data: {
            'date':date
        },
        success: function(data) {
            $('#ajaxDiv').html(data);
        }
    });
}

function ajaxAdd(){
    var d = $("#datepicker").datepicker('getDate'),
        fullDate = $.datepicker.parseDate('dd-mm-yy',d);

    $.ajax({
        url:"getDiary.php",
        type: "GET",
        data: {
            'breakfast':diary1.breakfast.value,
            'lunch':diary1.lunch.value,
            'dinner':diary1.dinner.value,
            'date':fullDate
        },
        success: function(data) {
            $('#ajaxDiv').html(data);
        }
    });

    alert("Added value to database!");
    diary1.breakfast.value = "";
    diary1.lunch.value = "";
    diary1.dinner.value = "";
    ajaxFunction(fullDate);
}

Answer 2

Вы можете попробовать использовать метод trigger() следующим образом: $("button:first").trigger('click');, взятый из записи API .

Answer 3

Проблема с запуском ajaxFunction() при загрузке страницы состоит в том, что выбранная дата в указателе даты еще не будет отправлена ​​... в ajaxFunction вы делаете следующее:

var day1 = $("#datepicker").datepicker('getDate').getDate();

Вы можете либо проверить действительный ответ на getDate(), прежде чем создавать запрос, и вместо этого выполнить ajax-запрос к другой странице php, или использовать js, чтобы проверить возвращаемое значение getDate(), если это нормально, используйте его. , если не использовать функции даты javascript, чтобы использовать текущую дату.

Кроме того, все эти вещи xmlhttprequest ... если вы уже используете jQuery, вероятно, лучше использовать встроенные методы ajax.