Обновить входное значение onchange/oninput другого с помощью селектора календаря

Question

Мне нужно обновить значение одного поля, если изменяется значение другого. Поле, которое я хочу обновить, содержит метку времени, и поле, значение которого может измениться, содержит дату (yyyy-MM-dd). Изменение производится через селектор календаря, что, вероятно, является причиной того, почему события onchange и oninput не могут вызвать функцию.

Вот мой код:

<input required class="short" type="text" id="startdate" name="startdate" value="<?php echo (isset($startdate) ? $startdate : "") ?>" oninput="updateTimestamp();" /> 
    <input required class="short" type="text" id="startdate_u" name="startdate_u" value="<?php echo (isset($startdate_u) ? $startdate_u : "") ?>" /> 
    <a href="#" onclick="cal.select(document.forms['project'].startdate,'anchor','yyyy-MM-dd'); return false;" name="anchor" id="anchor"><img src="images/calendar_icon.png" /></a> 
    <script> 
     var cal = new CalendarPopup(); 
     function popup(mylink, windowname) { 
      if (! window.focus)return true; 
       var href; 
      if (typeof(mylink) == 'string') 
       href=mylink; 
      else 
       href=mylink.href; 
      window.open(href, windowname, 'width=500,height=300,scrollbars=yes,resizable=yes'); 
      return false; 
     } 
     function updateTimestamp() { 
      var startDate = document.getElementById("startdate"); 
      var newTimestamp = Math.round(new Date(startDate.value).getTime()/1000); 
      document.getElementById("startdate_u").value = newTimestamp.toString(); 
     } 
    </script> 

Вот ссылка на календарный код: http://www.mattkruse.com/javascript/calendarpopup/source.html

Я не использую JQuery. Ваш совет высоко ценится :) Весь сайт написан в соответствии со стандартами HTML5 - я читал, что oninput должен делать трюк, но это не так. Протестировано как на Chrome, так и на IE 11.

Answer 1

Этот календарь также определяет функцию setReturnFunction, которая ожидает, что имя функции получит результат.

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

Что-то вроде:

<script> 
    function dateSelected(y,m,d){ 
    // Fill in your input as probably it will not be filled. 
    // Trigger any additional functionality 
    updateTimestamp(); 
    var dateField = document.getElementById("startdate"); 
    dateField.value = y + "-" + m + "-" + d; 
    } 

    var cal = new CalendarPopup(); 
    cal.setReturnFunction('dateSelected'); 
    function popup(mylink, windowname) { 
    if (! window.focus)return true; 
    var href; 
    if (typeof(mylink) == 'string') 
    href=mylink; 
    else 
    href=mylink.href; 
    window.open(href, windowname, 'width=500,height=300,scrollbars=yes,resizable=yes'); 
    return false; 
    } 

    function updateTimestamp() { 
    var startDate = document.getElementById("startdate"); 
    var newTimestamp = Math.round(new Date(startDate.value).getTime()/1000); 
    document.getElementById("startdate_u").value = newTimestamp.toString(); 
    } 
    </script> 

Примечание: довольно много вещей в коде может быть улучшена, начиная с календарем.