In my angular 4 application I am using some input type=number, but in firefox I can write letters and this isn't what I want.
Why firefox allows this? Is there a way to make it works also in firefox because in chrome works perfectly.
this is my input field:
<label class="control-label">inserttickets <span class="star">*</span>
</label> <input type="number" class="form-control" id="blockFrom"
required [(ngModel)]="blockFrom" min="1" name="blockFrom"
#BlockFrom="ngModel">
I found some old discussions about that but maybe now there are some solutions?
Related
The default html date input shows a text field and a option to see the calendar. For accessibility purpose, I need the field to show just the numeric input space and not the calendar option.
I have tried the solution here but this only works for Chrome, IE and firefox still show the calendar.
Since Date Fields have compatibility issues. It is better to work with raw HTML with custom CSS styling. I did it for my projects also and it work fine in many situations. You may try working with this code below.
<div class="DemoClass">
<label for=""><strong>Date (dd/mm/yy)</strong></label>
<input type="number" name="date" min="1" max="30">
<input type="number" name="months" min="1" max="12">
<input type="number" name="years" min="1900" max="2099">
</div>
I am trying to get autocomplete on a creditcard form to work properly in Safari, however it seems to completely ignore the autocompletion for expiration date. Whether I use cc-exp or separate cc-exp-month/cc-exp-year, neither is working. The autocomplete for cc-name and cc-number are working properly though, as are things working properly in Chrome.
I have been able to bring the issue down to a very simple example:
<form>
<input type="text" autocomplete="cc-name" placeholder="name" />
<input type="text" autocomplete="cc-number" placeholder="number" />
<input type="text" autocomplete="cc-exp" placeholder="expiration" />
<input type="text" autocomplete="cc-csc" placeholder="cvc" />
</form>
What am I missing here? I already tried the older syntax using ID's, names and x-autocompletetype. Neither with any success. Tested on Safari 7 till 10, so this issue seems to be around for a while, or I am really missing something obvious?
(note: to test the example above, make sure you are visiting this page over https, else it would not work anyway)
I was just looking for a solution to this and noticed that on an older form, where I don't even have the autocomplete attribute, it works. The difference between the forms is that on the older form I am using 2 drop-down fields (SELECT tags) for expiry month and year in MM and YYYY formats.
After playing with different options, I concluded that Safari wants 2 separate fields, one for MM and one for YYYY. I now have 2 text fields like this:
<input type="text" name="CCExpiryMonth" id="CCExpiryMonth" value="" placeholder="MM" autocomplete="cc-exp">
<input type="text" name="CCExpiryYear" id="CCExpiryYear" value="" placeholder="YYYY" autocomplete="cc-exp">
This works in Safari.
I realised that placeholder attribute in Internet Explorer 11 does not work when the cursor is on (what a surprise!) despite that w3schools says it is compatible with ie10+ (even though their try it yourself example does not work well in ie).
This is what users see when they want to login:
so I found about ng-attr-placeholder instead but I cannot seem to make it work.
<input type="password" name="password" id="password" ng-model="user.password" class="form-control" ng-attr-placeholder="Password" required="" autofocus="">
Any ideas what I am doing wrong?
Thank you in advance!
I have a submit form in my website which works well with Firefox but does not work on Chrome and Safari. The input textbox is the only element giving trouble, all the other elements work fine with every browser. Do someone have a solution for this?
Here is the code of the textbox:
<div class="form-input-half-left form-input-border">
<div class="form-input-background opacity_2"></div>
<input id="name" type="text" name="x_first_name" value="name *" onclick="this.value = '';"/>
<span class="error"> <?php echo $x_first_nameErr;?></span>
</div>
i tried your code here in jsfiddle and works fine in both chrome and firefox.i couldn't replicate the error, but i think you can use placeholder for your purpose and it works much more better than onclick
<input id="name" type="text" name="x_first_name" placeholder="name *"/>
may i know the problem is on which version of chrome and what is the problem exactly? it doesn't clear the text box or something else?
Is it possible to specify a decimal for a step parameter within the range element? According to a few articles I've read, including one on Nettuts, this should be possible. This does not appear to be working in any browsers. I've tried Chrome, Safari, and mobile Safari. Am I misunderstanding simple here, or is this just not supported quite yet?
<input id='something' type='range' min='0' max='20' step='.25' value='5' />
http://jsfiddle.net/Df57B/
Check out this demo it is possible to give steps in decimal.
<input type="range" name="points" min="1" max="10"
step="0.25" onchange="alert(this.value)"/>
Your mistake take is that you gave .25 instead of 0.25.
The following works for me in chrome, I'm thinking that it's the shortcut step=".25" that won't work
<input id="something" type="range" min="0" max="0" step ="0.25" value="5" />
If you want to make it work in Firefox 4+, you can use the following: HTML5Slider