2012-02-16 66 views
3

我有以下的javascript一個非常簡單的HTML頁面,它jQuery UI的日期選擇器從輸入字段

$(function() { 
    $("#datepicker").datepicker({ 
     changeMonth: true, 
     changeYear: true 
    }); 
    $("#datepicker").datepicker("option", "dateFormat", "yy-mm-dd");   
}); 

然後,我必須輸入目標元素

<input id="datepicker" type="text" class="boxtpl" name="${field.name}" value="${release?.startDate}"> 

,我看到了刪除我的文字從收視源是有效輸入的HTML ...

<input id="datepicker" type="text" class="boxtpl" name="release.startDate" value="2012-02-07"> 

所以當我做GET請求得到這個頁面,我的日期只會呈現,如果我刪除JavaScript中的最後一行設置格式,這是非常重要的格式,因爲這是我爲playframework配置的格式!!!!!如果我不設置格式,經後打破,因爲格式不匹配:(

爲什麼設定日期選擇器的清理出我的約會????格式

我可以嘗試腳本更多設置它手動,雖然我試圖調用api來設置它,並沒有工作,所以它可能無法正常工作原始的JavaScript設置要麼...不知道現在還有人知道爲什麼會發生這種情況或更好的但如何解決它???

感謝, 院長

回答

5

不知道,如果它在jQuery UI的一個bug,但似乎設置格式有效地刪除默認值。你可以用鏈

.datepicker("setDate", datepicker_default_val); 

但是解決這個問題,我在我的web應用程序所做的就是定義一個CSS類「.datepicker」,然後寫這個代碼片斷提供日期選取任何與該類。

$(".datepicker").each(function(index){ 
      var datepicker_default_val = $(this).val(); 
      $(this).datepicker({numberOfMonths: 3, showButtonPanel: true}); 
      $(this).datepicker("option", "dateFormat", 'yy-mm-dd'); 
      $(this).datepicker("setDate", datepicker_default_val); 
     }); 

這樣做是與標籤類爭奪每一個元素,保存默認值局部變量datepicker_default_val,設置格式,並然後恢復值。

一點點的黑客,但把它放在$(document).ready(function(){});塊,你應該很好。

+0

你還必須解析日期'datepicker_default_val = $ .datepicker.parseDate('yy-mm-dd',$(this).val()) '。 – hlcs 2018-02-25 17:24:00

1

你是什麼意思:

經後打破,因爲格式不匹配

另外,我不太明白你的你的GET和POST請求是什麼意思?你的意思是表單方法嗎?在這種情況下,您應該使用周圍的表單標籤修改您的HTML代碼並添加一個提交按鈕,以便我們可以準確理解您想要的內容並嘗試重現問題。

無論如何,看看是否是你想要什麼:http://jsfiddle.net/DAMEj/

其實我只是包括除了自己的CSS代碼的完整測試的jQuery用戶界面庫。

此外,我沒有得到這些屬性name="${field.name}" value="${release?.startDate}"的目的,你能澄清一下嗎?

最後,究竟是什麼不適合你?

編輯:

所以,根據我對默認的日期顯示最後的評論,請檢查了這一點http://jsfiddle.net/sidou/ZUrPj/,看看它是否適合你的需要。

快樂JS弄虛作假;)

+0

將html更改爲瀏覽器收到的內容,正如我所說的那樣,並且您向我展示的AWESOME工具演示了它(只需刪除一行javascript,然後再次運行)。 +1只是爲你展示給我的那個很酷的工具。 – 2012-02-16 12:15:30

+0

這個工具太酷了。基本上,這個http://jsfiddle.net/b5qaP/不起作用,而這是http://jsfiddle.net/x7jfz/ – 2012-02-16 12:27:21

+0

我想我開始明白你想要什麼!我們正在討論一個默認的日期值,它必須顯示在右側的輸入字段中? – Sidou 2012-02-16 18:51:59

0

如果輸入值不能被jQuery解析,它確實會從輸入字段中(甚至從altField中,如果你設置的話)刪除該值。

例如,使用不同的區域設置時可能會發生這種情況。如果您將datepicker dateFormat設置爲「dd MM yy」並使用法語本地化,則會解析「10 Mars 2012」,但「2012年3月10日」的值將被刪除。

1

如果輸入字段與默認的dateFormat不匹配,它將簡單地刪除它。 第二行中的選項設置爲時已晚,在第一行之後它已被刪除。

解決方案:將在第一次調用的日期格式:

$("#datepicker").datepicker({ 
    changeMonth: true, 
    changeYear: true, 
    dateFormat: "yy-mm-dd" 
}); 
0

就我而言,我發現比JQuery的是由「formoid」解決方案inyected,洙,我只需更換其中的數據是功能再注入,加入線

「值」:date.attr( 「值」)

我與Shaun答案混合太:

jQuery(".formoid-flat-blue").find('input[type=date]').each(function(){ 
    var date = $(this); 
    var datepicker_default_val = $(this).val(); 
    var text = $('<input type="text">'); 
    text.get(0).className = date.get(0).className; 
    text.attr({ 
     "name": date.attr("name"), 
     "placeholder": date.attr("placeholder"), 
     "required": date.attr("required"), 
     "value": date.attr("value") 
    }); 
    date.replaceWith(text); 
    text.datepicker({ 
     format: _dateFormat || date.attr("data-format") || 'yyyy-mm-dd' 
    }); 
    if (datepicker_default_val) { 
     text.datepicker({ 
      setDate: datepicker_default_val 
     }); 
    } 
});