如何使用javascript格式进行日期选择?

时间:2013-12-08 05:13:28

标签: javascript php mysql sql date

enter image description here在我的PHP项目中,我使用3个组合框来选择年,月和日期。但我无法格式化这3个值以在2013-10-01类型中保存为数据库中的日期。以下是我选择日期的代码。

  <p>
      <label class="floated" for="dtb_yr"><b>Date of Birth :</b></label>

            <select name="dtb_yr">
                <option value="2013" />2013
                <option value="2014" />2014
                <option value="2015" />2015
                <option value="2016" />2016
                <option value="2017" />2017
                <option value="2018" />2018
                <option value="2019" />2019
                <option value="2020" />2020
                <option value="2021" />2021
                <option value="2022" />2022

            </select>

            <select name="dtb_mon">
                <option value="january" />January
                <option value="february" />February
                <option value="March" />March
                <option value="Apirl" />Apirl
                <option value="May" />May
                <option value="June" />June
                <option value="July" />July
                <option value="August" />August
                <option value="September" />September
                <option value="October" />October
                <option value="November" />November
                <option value="December" />December
            </select>

            <select name="dtb_day">
                <option value="01" />01
                <option value="02" />02
                <option value="03" />03
                <option value="04" />04
                <option value="05" />05
                <option value="06" />06
                <option value="07" />07
                <option value="08" />08
                <option value="09" />09
                <option value="10" />10
                <option value="11" />11
                <option value="12" />12
                <option value="13" />13
                <option value="14" />14
                <option value="15" />15
                <option value="16" />16
                <option value="17" />17
                <option value="18" />18
                <option value="19" />19
                <option value="20" />20
                <option value="21" />21
                <option value="22" />22
                <option value="23" />23
                <option value="24" />24
                <option value="25" />25
                <option value="26" />26
                <option value="27" />27
                <option value="28" />28
                <option value="29" />29
                <option value="30" />30
                <option value="31" />31
            </select>
            <br class="clear"/>
        </p>


有没有办法以更精确的方式选择日期和保存日期,如下面textfeild所示?

     <p>

            <label class="floated" for="model_no"><b>Model no :</b></label>
            <input type="text" name="model_no" id="model_no" placeholder="Enter Modle No" />
            <br class="clear" />
        </p>

4 个答案:

答案 0 :(得分:1)

使用像这样的月份选项

<select name="dtb_mon">
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">Apirl</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>

提交表格后

<?php
$date_string=$_POST['dtb_yr']."-".$_POST['dtb_mon']."-".$_POST['dtb_day'];
?>

答案 1 :(得分:1)

我认为使用Jquery UI的datepicker可能更容易使用单个文本字段,而不是使用3个不同的组合框来格式化日期。 http://jqueryui.com/datepicker/#date-formats

对于您要查找的格式,您可以自定义日期选择器的输出。文档非常清楚。

如果你真的想要3个不同的盒子,Zahidul的答案应该有效。

修改

使用此代码作为指南:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>jQuery UI Datepicker - Format date</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script>
  $(function() {
    $( "#datepicker" ).datepicker();
    $( "#format" ).change(function() {
      $( "#datepicker" ).datepicker( "option", "dateFormat", "dd mm yy" );
    });
  });
  </script>
</head>
<body>

<p>Date: <input type="text" id="datepicker" size="30"></p>

重要的部分是$( "#datepicker" ).datepicker( "option", "dateFormat", "dd mm yy" );,您可以根据需要格式化日期。

答案 2 :(得分:1)

您可以使用只需要选择日期的Jquery Date选择器,它可以在数据库中以指定格式保存。

将此代码添加到HTML文档的头部。

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
 <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
 <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>


 <script>
   $(function() {
   $( "#dtb_yr" ).datepicker({ dateFormat: 'yy-mm-dd' });
 });
 </script>

在表单中添加此项 在HTML中:

<input type="text" name="dtb_yr" id="dtb_yr" placeholder="Select Date" />

在PHP文件中添加此代码 在PHP中:

 $dtb_yr =  $_POST['dtb_yr'];

答案 3 :(得分:0)

您可以使用您获得的值,并且在PHP端您可以使用MYSQL的STR_TO_DATE函数。您需要一个小映射器来获取文本中的月份编号。然后你使用这个函数---&gt;得到输出并用它来插入你的数据库。检查这里的文章http://dev.mysql.com/doc/refman/5.0/en/date-and-time-functions.html#function_str-to-date

 STR_TO_DATE('01,5,2013','%d,%m,%Y');
顺便说一句,4月份是一个错字。