How to set the animations on input box on browser’s back button ?

I am using jquery polymerlink form plugin for creating the material design effect on text in input boxes of my form. This form is a progressive form which contains six sections which are shown to he user on the click the ‘next’ button in whichever section he is.
![Like this][2]
The problem is when the user focuses on any input box the animations work just fine but when a user goes back to a section already filled, the labels(or in this case the placeholder) come back to their original positions over the text. I want that if their is a value inside the input boxes, then the labels should stay up otherwise they should be in their original position. I have run a script to check if the input is empty before the polymer form wraps around it but it doesn’t work.

  1. State 1
    ![This is state 1 when user normal focuses on input box][3]
  2. State 2 when user comes back on the section using back button/the top prgress bar
    ![State 2][4]

Source: forms

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.