I came across a problem today in which I had to enable some options (which are disabled on page load) once the text area/div which has a scroll attached to it has reached the end. Usually such are the requirements when you want the user to scroll through or read the complete text before he can continue with whatever hes doing. Since it might become a requirement for other projects as well, I decided to wrap it up inside a small and neat directive. Here is how to use it:
*By setting a variable, I mean setting it to a value true.
There are 2 simple steps to accomplish setting a variable from the directives parent scope once the scroll has reached its end:
- Place a uk-scroll directive on the textarea/div. This would place a scroll listener on the tag with the required logic.
- Provide the uk-scroll directive with a variable on the scope to set via the set-on-scroll-complete attribute.
Once the scroll has reached its end, the value of the variable on the scope, which is in the above case, “radBtn” would be set i.e. “radBtn = true”
Here is how the directive source looks like:
Hope this might come in handy. Keep the suggestions/recommendations coming in.
Source code can be found here.