2016-04-26 85 views
0

我有一個簡單的PHP表單如何更改日期的jQuery:基於其他日期

<form> 
    Date of dispatch<br> 
    <input type="datetime" name="date_dispatch" id="date_dispatch" value="2016-04-26 10:00:00"><br> 
    Expected delivery timne<br> 
    <input type="datetime" name="date_delivery" id="date_delivery"> 
    <br> 
    <input type="submit" value="Submit"> 
</form> 

用戶可以指定第一日期(何時收集包裹),第二場應該是預計交貨日期。但是交貨時間不能早於3小時,然後是夾頭時間。 如何使用AJAX/JQUERY將date_delivery的值更改爲基於date_dispatch +3小時自動計算。

我嘗試了一些測試,但沒有結果:

$(document).ready(function(){ 

    $('#date_dispatch').change(function() { 
    document.getElementById('date_delivery').value = 'test'; 
    }); 

}); 

這是我測試的小提琴: https://jsfiddle.net/xr7cm6w7/

會感謝所有幫助

+0

ajax用於與服務器通信。你只是想要javascript(可能jquery層疊在上面)。 –

+0

好的,謝謝澄清 – Tikky

回答

0

你不需要使用AJAX爲只要你想顯示這個值只。 使用JavaScript Date對象在第一個輸入切換功能

here sth more about this

0

下面是使用jQuery處理它的功能:

$(document).ready(function(){ 
    $('#date_dispatch').change(function() { 
    // Get current dispatch time 
    var time = new Date($('#date_dispatch').val()); 

    // Add 3 hours 
    time.setTime(time.setHours(time.getHours()+3)); 

    // Set delivery time 
    $('#date_delivery').val(time.toString()); 
    }); 
}); 

這裏的的jsfiddle:https://jsfiddle.net/mewcg3zo/10/

你會發現格式不一樣,你必須做一些額外的工作才能讓日期字符串恢復到你想要的狀態。你可以在這裏看看如何做到這一點的提示。 Javascript format date/time

+0

你好,thanx的貢獻,但這是行不通的,當我改變第一個日期時,我只能看到第二個字段'無效日期',而不是日期(即使在其他日期格式)的文本。或者這需要先修改才能更改日期? – Tikky

+0

它可以工作,但有些事情需要檢查驗證。一個空字符串,字母或甚至像下午1點這樣的時間將不適用於此實現。 –

+0

我只是改變一小時:「2016-04-26 10:00:00」爲例如「2016-04-26 11:00:00」,只能看到一個'無效日期' – Tikky