Scroll to a particular div in jquery?

Question

I have to scroll to a particular div onform submit (if there is any error). But it goes to the top of the window without showing the error message. Here is my code :

HTML

<form name="createProperty" method="POST" onsubmit = "return submit_new_property()">
    <select class="slt_box" name="property_type" id="property_type">
        <option>Select</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
    </select>
</form> 

JS

function submit_new_property() {
    var property_type = $('#property_type').val();

    if(property_type == 'Select' || property_type == '' || property_type == null) {
        document.getElementById("basic_info_error_div").innerHTML="Choose Property Type";
        document.getElementById("basic_info_error_div").style.display='block';
        $.scrollTo( $('#basic_info_error_div'), 500);
        return false;
    }
    else {
        document.getElementById("basic_info_error_div").innerHTML = "";
        document.getElementById("basic_info_error_div").style.display = 'none';
    }
}

Answer 1

You can use .scrollTop()

$('html, body').animate({
    'scrollTop' : $('#basic_info_error_div').position().top
}, 500);

OR

If you want vanilla JS, You can use Element.scrollIntoView

document.getElementById('basic_info_error_div').scrollIntoView(true);

Answer 2

  $('html, body').animate({
    scrollTop: $("#basic_info_error_div").offset().top
  }, 500);

Answer 3

You seem to be trying to use the jquery.scrollTo plugin. You need do download it from the releases page .

After that you can do:

$.scrollTo('#basic_info_error_div', 500);

And it will work as expected.

Cheers