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">
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">
If I set up min = 0.5 than it will only can input 0.5 , 1.5, 2.5 etc.
It cant input a integer like 1, 2, 3 etc.
I am confused. Anyone can tell me why? And how to keep minimum is 0.5 but also accept integer?
<form>
<input type="number" min=0.5 required>
<input type="submit">
</form>
Because you don't provide step, so the default is 1. Just set step attribute to resolve your task
<input type="number" min=0.5 step=0.5 required>
You should use step instead. i.e.
<form>
<input type="number" step="0.5" min="0.5" required>
<input type="submit">
</form>
This is my current code for the input field. How can I make it display a message saying that the number I've entered should not start with zero? thanks
<input type="number" min="10" max="1000" class="form-control" name="payment"
placeholder="enter payment" style="text-align:center" autofocus required/>
<br/>
For instance, typing 020 should not be accepted. Only numbers between 10 to 1000.
This should work:
<input type="text" class="form-control" name="payment"
placeholder="enter payment" style="text-align:center" autofocus required
pattern="[1-9]\d*" title="A number with no starting zeros"/>
https://jsfiddle.net/spL2par2/
try this using HTML's pattern attribute
<input type="number" class="form-control" name="payment"
placeholder="enter payment" style="text-align:center" pattern="[1-9]\d*" autofocus required/>
<br/>
I have this type of input in my view:
Form::number('name', 'value');
But I would like to set a max and min values to it, I can't seem to find the way using blade.
In html:
<form action="/action_page.php">
<input type="number" name="quantity" min="1" max="5">
<input type="submit">
</form>
You can do that as follows:
{{Form::number('name', 'value',['min'=>1,'max'=>5])}}
Hope this helps you.
I have this HTML code
<form method="post" action="cashier.php" enctype="form-data/multipart">
<input required id="amount" type="number" min="0" class="form-control" name="txtamount" placeholder="Enter Payment Here..." />
<input required id="cash" type="number" min="document.getElementById('amount').value" class="form-control" name="txtcash" placeholder="Enter Cash Here..." />
<input type="submit" class="btn btn-primary pull-right" name="btnenroll" value="Done" />
</form>
If I type 1000 on id="amount", the id="cash" min will be 1000.
But it doesn't work.
The most straightforward way is to add an onchange handler to the payment input, such as:
<form method="post" action="cashier.php" enctype="form-data/multipart">
<input required id="amount" type="number" min="0" class="form-control" name="txtamount" placeholder="Enter Payment Here..."
onchange="document.getElementById('cash').min=this.value;"/>
<input required id="cash" type="number" min="document.getElementById('amount').value" class="form-control" name="txtcash" placeholder="Enter Cash Here..." />
<input type="submit" class="btn btn-primary pull-right" name="btnenroll" value="Done" />
</form>
This gets you the functionality you are looking for without needing to include a third party library like jQuery.
In this case you should use Jquery onchange or keypress
$("#cash").attr({
"min" : $("#amount").val()
});
If you are using jQuery, use the below,
$("#amount").change(function() {
$("#cash").attr('min',$("#amount").val());
});
Refer - https://api.jquery.com/change/
I don't think you can put javascript in min, and also you have a pair of double quote in another pair of double quote, which will break the the tag (You can inspect element and you will figure out.)
So the idea is when the value of amount element change, we change cash's min value. So we can add a event listener to amount element. Whenever it is changed, set the min for cash element. Here is a working sample code:
<form method="post" action="cashier.php" enctype="form-data/multipart">
<input required id="amount" type="number" class="form-control" name="txtamount" placeholder="Enter Payment Here..." />
<input required id="cash" type="number" class="form-control" name="txtcash" placeholder="Enter Cash Here..." />
</form>
<script>
function setMin() {
var amount = document.getElementById("amount");
var cash = document.getElementById("cash");
cash.min = amount.value;
}
var trigger = document.getElementById("amount");
trigger.addEventListener("change", setMin, false);
</script>
As you can see, I removed your js in html and add a event listener. Hope this will help.