I have a page with some forms.
Each form contains some field restrictions, such as required , etc.
I want to display errors during verification only when the user interacts with them (UX? => Yes).
Indeed, as long as the $pristine field means no touch, errors should not be displayed.
I managed to achieve this requirement with a large number of browsers besides ... Internet Explorer (especially IE> 10). Indeed, IE seems to treat all fields as $dirty from the start!
Surfing the net, I found this βfixβ:
MyMainAppModule.config(['$provide', function ($provide) { $provide.decorator('$sniffer', ['$delegate', function ($sniffer) { var msie = parseInt((/msie (\d+)/.exec(angular.lowercase(navigator.userAgent)) || [])[1], 10); var _hasEvent = $sniffer.hasEvent; $sniffer.hasEvent = function (event) { if (event === 'input' && msie > 10) { return false; } _hasEvent.call(this, event); }; return $sniffer; }]);
Launching this and ... wowww IE is playing well now. Running it in Safari Mobile (Iphone) ... disappointment. What for? Since any typed characters are AFTER AFTER event handlers such as $watch , etc., Which leads to a shift between what was expected from what happened. Too bad since it worked well in Safari Mobile before.
So the actual dilemma is: prioritize Safari Mobile or IE :)
Has anyone ever experimented with this situation in IE? Are there any other βbetterβ fixes that I could implement?
source share