2012-02-16 67 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 
     }); 
    } 
});