shai tal

shai tal

The problem:

when you use forms in angular you might find this issue:

When you are focused in input field, the placeholder disappears and you don’t know what to type in.

here you can see the issue:

 


The solution is the write a small directive to make the placeholder pop up when focusing the field

Here is the code that make a placeholder turn into popup in Angular

This is the directive:

.directive('popuplaceholder', function () {
   return function (scope, element, attrs) {
      element.bind('focus', function (event) {
         scope.$apply(function () {
            $('.tooltipplaceholder').show().html(attrs.placeholder);
         });
      });
      element.bind('blur', function (event) {
         scope.$apply(function () {
            $('.tooltipplaceholder').hide().html();
         });
      })
   };

in the view you should place popuplaceholder as an attribute of the input feild

as followed:

         <input popuplaceholder class="generalinput block" name="dnotes" type='text' ng-model="dnotes" placeholder="הערות כלליות "/>

The css of the popup

.tooltipplaceholder{direction:rtl;z-index: 999999;position: fixed;top:20px;background: red; color:#fff;border-radius: 30px;right: 10px;left:10px;display: none;padding: 15px;text-align: center;}

At last you should place an empty div in your html

  <div class="tooltipplaceholder"></div>   

 

enjoy

קרא עוד...

sometimes when you sell a product in virtuemat you want to to be able to show the customer what the main product contains, e.g glasses contains lens.

here is a short tutorial:

 

קרא עוד...
הרשם ל RSS
Log in