要解析为URL的数据贴图格式和日期格式

时间:2016-03-18 12:20:32

标签: javascript datepicker

我的日期选择器有两种日期格式需要帮助。

最初在浏览器上显示时我需要采用欧洲格式dd-mm-yy但是当我在URL上传递它时我需要它采用yy-mm-dd格式,以便预订系统可以识别它。这是可能的。

我的后端是wordpress所以我正在使用wordpress的默认日历日期选择器。

<form action="http://localhost/booking/" method="GET" class="">
<input type="hidden" name="Op" value="SetState" />
 <p class="acontact left calendar">
 Check-in Date<br>
<span class="checkin"><input type="text" name="DateFrom" value="2016-04-05" size="40" class="MyDate" name="MyDate_a" aria-required="true" id="dp1457978166549" style="width:150px;"> </span>
</p>

<p class="acontact left calendar">
Check-out Date<br>
<span class="checkout"><input type="text" name="DateTo" value="2016-04-08" size="40" class="MyDate" name="MyDate_b" aria-required="true" id="dp1457978166550" style="width:150px;"> </span>
</p>

<div class="button"><input class="request" name="anfrage" type="submit" value="Check Booking"></div>
</form>

<script type="text/javascript">

jQuery(document).ready(function() {
jQuery('.MyDate').datepicker({
    dateFormat : 'yy-mm-dd'
});
});

我不熟悉javascript,所以感谢您的帮助。

2 个答案:

答案 0 :(得分:1)

更新: - &gt;检查此代码,我更改了日期值,它们采用dd-mm-yy格式,但按下按钮后,它们将以yy-mm-dd格式显示,同时检查请求的网址:

<form action="http://localhost/booking/" method="GET" class="">    
<input type="hidden" name="Op" value="SetState" />
<p class="acontact left calendar">
Check-in Date<br>
<span class="checkin"><input type="text" name="DateFrom" value="13-12-2016" size="40" class="MyDate" aria-required="true" id="dp1457978166549" style="width:150px;"> </span>
</p>

<p class="acontact left calendar">
Check-out Date<br>
<span class="checkout"><input type="text" name="DateTo" value="14-12-2016" size="40" class="MyDate" aria-required="true" id="dp1457978166550" style="width:150px;"> </span>
</p>

<div class="button"><input class="request" name="anfrage" type="submit" onClick="runf()" value="Check Booking"></div>
</form>

<script type="text/javascript">
function runf() {
var d1 = document.getElementsByName("DateFrom")[0].value;
var d2 = document.getElementsByName("DateTo")[0].value;
alert("DateFrom Before: "+d1);
var segments = d1.split('-');

d1 = segments[2] + '-' + segments[1] + '-' + segments[0];

document.getElementsByName("DateFrom")[0].value=d1;

alert("DateFrom After: "+d1);
alert("DateTo Before: "+d2);
segments=d2.split('-');

d2 = segments[2] + '-' + segments[1] + '-' + segments[0];

document.getElementsByName("DateTo")[0].value=d2;

alert("DateTo After: "+d2);

}     

答案 1 :(得分:0)

我使用alfField和altFormat属性解决了这个问题,并包含一个隐藏的新输入来存储替代格式:

jQuery(document).ready(function() {
   jQuery('.MyDate').datepicker({
      dateFormat : 'dd-mm-yy',
      altField: "#alternative_input_id",
      altFormat: 'yy-mm-dd'
    });
});

通过这样做,您可以从隐藏的新输入类型中获取所需的格式。

希望它对你有所帮助!

此致

编辑:我看到你有两个文本输入,你按类制作日期选择器。使用我发布的方法你需要为你拥有的每个文本输入设置ID,然后两次声明datepicker,每个输入文本一个(并创建两个隐藏的输入):

$(document).ready(function() {
   $('#dp1457978166549').datepicker({
      dateFormat : 'dd-mm-yy',
      altField: "#alternative_input_id_1",
      altFormat: 'yy-mm-dd'
   });
   $('#dp1457978166550').datepicker({
      dateFormat : 'dd-mm-yy',
      altField: "#alternative_input_id_2",
      altFormat: 'yy-mm-dd'
   });
});