0

In script validation my code like this,

if (!obj.checked){
        if (attendance_tardy.checked == true){
            attendance_tardy.click();
        }
        absentType.required = true; // flash error message
        dropdown.style.display = "block";
        remark_div.style.display = "block";
        tardy_div.style.display = "none";
        remarks.required = true;

    }else{
        dropdown.style.display = "none";
        absentType.required = false;
        remark_div.style.display = "none";
        tardy_div.style.display = "block";
        remarks.required = false;
    } }  

In this, I want to scroll where the error displayed by required term. What code want to be add? I am not clear view with this. Someone Help me.

EDIT
This is my div part in view page,

<div id="reason<%= index.to_s %>" <% if (list.attendance_status == true) then %> style="display: none;" <% end %>>
                        <% if (@absenteelists != nil) then %>
                            <%= collection_select(:absent, 'absent_type'+index.to_s, @absenteelists, :parameter, :value,
                            {:prompt => "Select Reason", :selected => list.absent_type},
                            {:class => "country_code-drpdwn select2"}) %>
                        <%else%>
                            <select id="absent_absent_type"+index.to_s name="absent[absent_type]" class="country_code-drpdwn select2">
                                <option value="">Select Reason</option>
                            </select>
                        <%end%>
                    </div>

Thanks.

Prabha
  • 21
  • 13
  • You can find answer here: http://stackoverflow.com/questions/4801655/how-to-go-to-a-specific-element-on-page and here: http://stackoverflow.com/questions/5007530/how-do-i-scroll-to-an-element-using-javascript. – Andrew Paramoshkin Jan 24 '17 at 07:34
  • @AndrewParamoshkin Can u pls explain with my code. I get the flash messages but I cant scroll to exact error place. Can u give a code where to join inside this script. Sorry I am new to script validation. – Prabha Jan 24 '17 at 10:54
  • This is not about validation at all. For example, you have 3 error messages (or inputs with errors), and your JS can find 'em (with a class, or a id or smth else). So you may just scroll to these elements (for example first of them) on page loads with window.scroll or jQuery animate. – Andrew Paramoshkin Jan 24 '17 at 11:02
  • @AndrewParamoshkin this.scrollIntoView(false); This makes the scrolling. I saw with some example by using this one. I will try with this. – Prabha Jan 24 '17 at 11:23
  • from ur point jquery animate I search with that also. Thanks :) – Prabha Jan 24 '17 at 11:25

1 Answers1

0

I am getting scroll to the error spot by using, the following code.

 var elements = document.querySelectorAll('select');//instead of select can use other input types 
 for(var i = elements.length; i--;) {
 elements[i].addEventListener('invalid', function () {
     this.scrollIntoView(false);
 });
}  

This works well for me. :):)

Prabha
  • 21
  • 13