I was playing around with this http://www.phpform.org/ to create a form.
One of form html is the following.
I am not sure what kind of type I should use it for HH, MM and AM/PM.
Should I use TINYINT with 2 length for HH, MM and VARCHAR with 2 length for AM/PM?
Should I have separate field for each?
...
...
<li id="li_1" >
<label class="description" for="element_1">Time </label>
<span>
<input id="element_1_1" name="element_1_1" class="element text " size="2" type="text" maxlength="2" value=""/> :
<label>HH</label>
</span>
<span>
<input id="element_1_2" name="element_1_2" class="element text " size="2" type="text" maxlength="2" value=""/> :
<label>MM</label>
</span>
<span>
<input id="element_1_3" name="element_1_3" class="element text " size="2" type="text" maxlength="2" value=""/>
<label>SS</label>
</span>
<span>
<select class="element select" style="width:4em" id="element_1_4" name="element_1_4">
<option value="AM" >AM</option>
<option value="PM" >PM</option>
</select>
<label>AM/PM</label>
</span>
</li>
Thanks in advance.
Store it as a regular 24 hour HH:MM:SS (the mysql time type). Do the formatting when outputting. You can use TIME_FORMAT() to reformat it into AM/PM format:
mysql> SELECT TIME_FORMAT('22:22:22', '%r');
-> '10:22:22 PM'
The three fields together represent a time. The most appropriate type for this would be TIME. There's no need to keep them separate and it makes your database more complex than it needs to be.
Related
The result should be like this, 2018-00130. The first 4 numbers are year, I wanted to limit the year to 2010 up to 2022.
I have tried to use the input type = number but I can't limit the numbers since I need the dash sign.
My pattern for now is just like this, pattern="[^a-zA-Z]*" maxlength = "10".
This is a very basic RegEx and quite simple to implement.
Here's the code:
<form>
<label for="code">Code:</label><br>
<input type="text" id="code" name="code" pattern="20(1[0-9]|2[0-2])-[0-9]{5}" maxlength="10" required>
<input type="submit" value="Submit">
</form>
Try this:
<input type="text" maxlength="4" style="width:50px;"> - <input type="text" maxlength="6">
I have this input field
<input type="datetime-local" required>
I would like the date part to be always required, but not the time part...
I tried with pattern, like
pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}.*"
but it doesn't seem to work...
any idea...
Edit:
I explain better here
<form name="test" method="POST" action="/">
<input type="datetime-local" name="event_date_start" id="event_date_start"
min="2011-06-07T00:00"
max="2099-06-14T00:00" required><br>
<input type="submit"/>
What I want is to use datetime, but time must be optional.
With the above example, submit is not allowed until you insert 00 in the time field..
I want to leave that optional...
No need for pattern just use the attributes min, max and value:
<input type="datetime-local"
value="2018-06-12T19:30"
min="2018-06-07T00:00"
max="2018-06-14T00:00" required>
If you want an inputfield with date only use:
<input type="date" required>
For time is optional:
<input type="date" required> <input type="time">
Herein, a textfield format 2018-05-22 00:00:00 which for dateTime columns in my DB. I am trying to make it two textfield without change into my table wherein one is for date(date-picker) and another is for time.
<div class="form-group col-lg-5">
{!! Form::label('tradedate', 'Traded date:') !!}
<div class=" input-append date form_datetime" data-date="{{date('Y-m-d H:i:s')}}" data-date-format="dd MM yyyy - HH:ii p" data-link-field="dtp_input1">
<input size="16" type="text" value="" readonly class="form-control">
<span class="add-on"><i class="icon-remove"></i></span>
<span class="add-on"><i class="icon-th"></i></span>
</div>
<input type="hidden" id="dtp_input1" value="" name="tradedate" />
</div>
I think issue is that you are not using any sort of function for your date-date-format attribute.
<div class=" input-append date form_datetime" data-date="{{date('Y-m-d H:i:s')}}" data-date-format="{{date('dd MM yyyy - HH:ii p')}}" data-link-field="dtp_input1">
Just for information in laravel you can use Carbon to deal with date and times. We can do date logic very easily using it. Link below: https://carbon.nesbot.com
Hope , it helps...thanks..cheers.
Is there a way to set a Time limit for a Datetime-local element.
For example, being able to make a booking between the times of 8:00AM to 18:00 AM and to be able only to choose between that in a DateTime-local. Here is my HTML code as well, if it could help:
<h1 id="header">Bookings Creation</h1>
<form action="booking.php" method="post">
First Name: <input type="text" name="FirstName" /><br />
Last Name: <input type="text" name="LastName" /> <br />
Date And Time From: <input type="datetime-local" name="DateAndTimeFrom"/><br />
Date And Time From: <input type="datetime-local" name="DateAndTimeTo"/><br />
Booking Type: <select name="BookingType"> <br />
<option value="0">Single</option>
<option value="1">Group</option>
<option value="2">Tournament</option>
</select>
<br/>
<input type="submit" id="button" />
</form>
As I checked datetime-local doesn't work with such attributes, but
you can use min and max attributes of time input like that:
<input type="time" min="08:00:00" max="18:00:00"/>
Now You can use min and max attributes to set limits for these input types as mentioned here:
<input type="datetime-local" id="meeting-time"
name="meeting-time" value="2018-06-12T19:30"
min="2018-06-07T00:00" max="2018-06-14T00:00">
I have a simple form with a date validation which works fine:
The problem is that when the validation kicks in, the "End Date" label gets misplaced as you can see (is above the date field box/calendar):
The code related is the following (it's just a form):
<form name="senstageaddform">
<div class="form-element">
<label for="ed_senStartDate" class="text-label">
{{i18n "EDUCATION_SEN_START_DATE"}} <span class="required">*</span>
</label>
<input type="text" class="date standard-text-field" maxlength="16" id="ed_senStartDate" name="startDate"/>
</div>
<div class="form-element">
<label for="ed_senEndDate" class="text-label">{{i18n "EDUCATION_SEN_END_DATE"}}</label>
<input type="text" class="date standard-text-field" maxlength="16" id="ed_senEndDate" name="endDate"/>
</div>
</form>
Is there any way to "pack" the form or any way to stop this happening?
Any hint please?
Thanks everyone