2017-02-20 102 views
0

我寻觅了很多互联网和审判他们,但他们都一起不工作我的问题是如何与日期选择器同时显示时间选择器如何添加时间选择与日期选择器

我已经有了这个代码对于日期选择器

<html> 
 
<head> 
 

 
<title>datetimepicker</title> 
 
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.0.min.js" type="text/javascript"></script> 
 
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.2/jquery-ui.min.js" type="text/javascript"></script> 
 
<link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.9.2/themes/blitzer/jqueryui.css"rel="Stylesheet" type="text/css" /> 
 
<script type="text/javascript" src="http://cdn.jsdelivr.net/json2/0.1/json2.js"></script> 
 
    </head> 
 
    <body> 
 
    <input class="w3-input w3-border " type="text" id="txt_fupdate" size="25" title="Follow Up Date" placeholder="Follow Up Date " runat="server" required>  
 
      <script type="text/javascript"> 
 
       $(function() { 
 
        $("#txt_fupdate").datepicker({ dateFormat: "dd-mm-yy" }).val() 
 
       }); 
 

 
      </script> 
 
    </body> 
 
    </html>

我的问题是我怎样才能添加或更新代码,以获得时间选择,请帮助对此。

+1

'jquery ui'默认没有时间选择器,但这里是一个插件'http:// trentrichardson.com/examples/timepicker /' – Mairaj

+0

或https://plugins.jquery.com/datetimepicker/ – vijayP

+0

检查这: - http://jquer.in/jquery-plugins-for-html5-forms/datetimepicker/ –

回答

0

至于说,你需要一个插件, 试试这个:https://plugins.jquery.com/simple-dtpicker/

请记住,包括您的文件夹中所需的文件

jquery.simple-dtpicker.js和jquery.simple,dtpicker.css

您的代码假设看起来像这样:

<html> 

<head> 
     <title>datetimepicker</title> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script> 
     <script src="https://cdn.rawgit.com/mugifly/jquery-simple-datetimepicker/72933bbe/jquery.simple-dtpicker.js"></script> 
     <link href="https://cdn.rawgit.com/mugifly/jquery-simple-datetimepicker/72933bbe/jquery.simple-dtpicker.css" rel="stylesheet" /> 
    </head> 

    <body> 

     <input id="txt_fupdate" class="w3-input w3-border " placeholder="Follow Up Date " required="" size="25" title="Follow Up Date" type="text" /> 
     <script type="text/javascript"> 
      $(function() { 
       $('#txt_fupdate').appendDtpicker({ 
        "closeOnSelected": true 

       }); 


      }); 
     </script> 

    </body> 

    </html> 

它的简单,有几个好等特点苏本地化。

+0

它的工作正常,但如何输入日期格式为* dd-mm-yyyy hh:mm * – Suhas

+1

我得到了那个''dateFormat':“DD-MM-YYYY H:mmTT” '通过使用这个我们可以改变 – Suhas