cvn / angular-shims-placeholder Goto Github PK

Since the text field you are creating in order to show the placeholder for password type fields does not have a tabIndex, it falls to the bottom of the tabbing order. To get it to work in my app, I changed the function to get the tabIndex of the password input and set the tabIndex of the new text input to the same value:
function setupPasswordPlaceholder() {
var tabIndex = domElem.tabIndex;
clone = angular.element('');
...

Hi, can this be updated to support angular 1.3+ ? right now the bower file says that only supports 1.2~.

Hi,

Can you please update the code to be DI compatible?
You need to prefix the directive definition like so
.directive('placeholder',['$timeout', '$document', '$interpolate', '$injector', 'placeholderSniffer', function($timeout, $document, $interpolate, $injector, placeholderSniffer) {

don't foget to add the ] at the end of the function :)

In setValue(val) the element gets the emptyClassName if the following condition is met: (!val && domElem !== document.activeElement). If val === 0 then the element will get the emptyClassName. Here is a plunker of the issue: http://plnkr.co/edit/5d5YMp5RgcvKKYz21D5S?p=preview

This may be a little preemptive, but I was getting a head start updating our app to the 1.6 release candidate and I haven't had any issues yet with this library supporting it.

Is there a chance we can get the bower file updated to support this?

Using the plugin with IE9, if the input text has focus the placeholder is not visualized.

hi
thanks for the code, it is very helpful.

i think i found a minor fix -

if the ng-model of a password is changed, the place holder is not hidden. so if i load a form with saved password, the place holder is hiding the password field, and it looks like you need to put the password

Now that the project has a bower.json file, it can be submitted to the bower registry.

The first thing that needs to happen is releases need to be tagged. I suggest creating a v0.1.0 tag at f05c0d8 (for historical purposes) and a v0.2.0 tag at the most recent commit. You can tag old commits on the releases page in the Target dropdown menu > Recent Commits tab. https://help.github.com/articles/creating-releases

Once that is done, you can add it to the bower registry from the command line bower register angular-shims-placeholder git://github.com/jrief/angular-shims-placeholder.git If bower is not installed globally, you may have to run it with ./node_modules/bower/bin/bower http://bower.io/#registering-packages

It would be valuable that being a library written for angular, unit tests would be rewritten using protractor.

In addition by means of grunt-protractor-runner it would be valuable to interconnect unit tests to saucelabs in order to automatize browser testing; saucelabs infact offer free accounts for opensource projects like angular-shims-placeholder

I'm writing this while integrating the library in GlobaLeaks globaleaks/GlobaLeaks#1533, that has a complete unit testing in place like the one i'm describing and where the library appear to not work properly.

From what i'm testing manually it works great but it seems to cause protractor detecting angularjs startup and this may lie some bugs: https://api.travis-ci.org/jobs/97890200/log.txt?deansi=true

You state this in the readme:

such as IE9, IE8, and below

But it seems it doesn't actually work in IE7. Can you confirm?

I also tried the demo page but it errors because it uses console so I can't tell if it should be working

With an ie8 virtual machine (modernie) under windows 7 or windows xp the placeholder doesn't work for passwords fields.

Hi,

I've been trying to implement the placeholder shim, but I can't seem to get the class 'empty' to get applied to the input I'm putting the directive on.

I have made a plunker to help showing this.
http://plnkr.co/edit/qH2o9UHhy7YBZ7qkygdi?p=preview

Any idea what I'm doing wrong?

Thanks!

I used a directive to replace native select ,and placeholder can't show , how to show it?

Since the plugin generates a text input for masking when polyfilling password input placeholder, focusing the original empty password input field won't be shown to the user.

ngModel should be optional. My application is not fully SPA and that is why my input elements may not have ngModel defined. Now if you don't define ngModel it will break. :<

Angular 1.5 was just recently released. I haven't noticed any issues in IE9 and above (including running the tests).

Would it possible get bower.json updated for angular 1.5?

Thanks!

This lib doesn't work when minified - it needs bracket notation as such:

.service('placeholderSniffer', ['$document', function ($document) {
.directive('placeholder', ['$timeout', '$document', 'placeholderSniffer', function ($timeout, $document, placeholderSniffer) {

Any js placeholders are causing problems with our legacy forms solution - is there any way I can apply only to the selected forms?

Hello!

On the latest IE9 (v9.0.40) some inputs has no whitespace between words.

Some lost whitespaces are showed by red points.

Thank you.

I will try to debug this situation later, but, maybe, you have a fast solution for this.

Compile a template and append to element, within the template there is an input with both ng-model and placeholder.
It can only show placeholder text, but not the ng-model value.
Instead, i think it should show the ng-model value(when ng-model value is not empty). And when user empty the input afterwards, the placeholder text shows again.

My fix:

With a change from

var orig_val = elem.val() || ''
to
var orig_val = eval('scope.'+elem[0]['ng-model']) || elem.val() || ''

can fix this, but i know it's really ugly and evil to use eval.
i also tried ngModel.$modelValue but always return NaN. Change priority of module is useless.

sorry be a newbie to angular

Hi, thanks for this module.

When I have an input with ng-model bound to a defined value, the placeholder replace that value. It is not a wanted behavior. It happen in IE8.

testing in IE8 (emulation mode)
the placeholder text is getting submitted as input value with the form object. How can this be avoided?

Hi,

thanks for your directive. :)

I'm changing the placeholder of an input text in my code in this way: $('#inputWithPlaceholder').attr('placeholder', 'new placeholder text');

Unfortunately the new placeholder is not shown in IE. I thought I could force the change by doing something like this:
$('#inputWithPlaceholder').triggerHandler('change');

Am I on the wrong track? Do you have an idea how to solve this problem?

Thanks!

Cheers,
Stefan

If the ng-model value is initialized after the placeholder directive (but in the same digest cycle), the value is hidden, and the placeholder is displayed instead.

see https://jsfiddle.net/7arxneod/6/ If you watch closely, the value will flicker between the expected value ($1.00) and 'placeholder' in ie9.

The issue seems to be the initialization of the placeholder. Since the placeholder directive's link function executes first, updateValue() will update the elements value in the next digest cycle to an empty string.

When the other directives link function initializes the value, the $render() function will correctly set the element's value, but because updateValue() uses $timeout, the displayed value is overridden in the next digest cycle.

Placeholder fails to work and logs "Error: Unspecified error." to the console when used inside an iframe in IE9. Placeholder text does show on load, but does not update on focus or blur.

https://jsfiddle.net/bqLv5cmt/1/