Show Time with HTML5 INPUT type time without AM/PM

Last Reply 28 days ago By dharmendr

Posted 28 days ago

how to show time with input type time without ampm in asp.net

                    <div class="col-md-12 form-group row">
                        <div class="col-sm-4 text-right">
                            <label class="control-label">Time :<span style="color: red">*</span></label>
                        </div>
                        <div class="col-sm-8">                            
                            <input type="time" class="form-control " runat="server"  placeholder="Select Time" id="Text1" />
                            <asp:Label ID="lbltim" runat="server" Style="display: none; color: red; font-weight: bold;">Please Select Time.</asp:Label>
                        </div>
                    </div>

 

You are viewing reply posted by: dharmendr 28 days ago.
Posted 28 days ago Modified on 28 days ago

Hi sivanaidu,

It is not possible without ampm. You should use custom input time to do this work.

Use BootStrap TimePicker controll to do this.

HTML

<style type="text/css">
    .bootstrap-timepicker-meridian, .meridian-column
    {
        display: none;
    }
</style>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-timepicker/0.5.2/css/bootstrap-timepicker.min.css" />
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-timepicker/0.5.2/js/bootstrap-timepicker.min.js"></script>
<script type="text/javascript">
    $(function () {
        $('#timepicker').timepicker({
            showMeridian: false,
            showInputs: true
        });
    });
</script>
<input id="timepicker" type="text">

Demo