Why my page trying to reload, when I am sending ajax query?

I am trying to send form with ajax, but even if I e.preventDefault() page trying to reload. here is my HTML:

<form action="/user/changeProfileData" id="edit-profile_form" method="post">
  <ul class='profile-data'>
    <li class='profile-data_item persona-icon'>Никнейм: <input id='profile_nickname' name='nickname' type="text" placeholder="Nickname:" value="" ></li>
    <li class='profile-data_item'>Name: <input name='name' id='profile_name' type="text" placeholder="Name:" value=""></li>
    <li class='profile-data_item'>Surname: <input name='surname' id='profile_surname' type="text" placeholder="Surname:" value="" ></li>
    <li class='profile-data_item b-day-icon'>Age: <input name='age' id='profile_age' type="text" placeholder="Age:" value=""></li>
    <li class='profile-data_item place-icon'><input type="text" name='city' id='profile_city' placeholder="City" value=""  :readonly="inputStatus == 1 ? true : false">, <input name='country' id='profile_country' type="text" placeholder="Страна" value=""  :readonly="inputStatus == 1 ? true : false"></li>
    <li class='profile-data_item phone-icon'>Phone: <input name='phoneNumber' id='profile_phoneNumber' type="text" placeholder="Phone:" value=""></li>
    <input type="hidden" name="_csrf" value='' />
    <input type="submit" value="Submit" id="edit-profile_submit">
  </ul>
</form>

And my ajax.js code:

$(document).ready(function(){

var csrf_token = ;

$("body").bind("ajaxSend", function(elm, xhr, s){
    if (s.type == "POST") {
        xhr.setRequestHeader('X-CSRF-Token', csrf_token);
    }
});



$('#edit-profile_submit').click(function(e) {
    e.preventDefault();
    $.ajax({
        contentType:"application/x-javascript; charset:UTF-8",
        global: false,
        type: 'POST',
        url: '/user/changeProfileData',
        dataType: 'html',
        data: {
            name: $("#profile_name").val(),
            nickname: $("#profile_nickname").val(),
            surname: $("#profile_surname").val(),
            country: $("#profile_country").val(),
            city: $("#profile_city").val(),
            phoneNumber: $("#profile_phoneNumber").val(),
            age: $("#profile_age").val()
        },
        success: function (result) {
            console.log(result);
        },
        error: function (request, status, error) {
            console.log(error);
        }
    });
});
});

And server code, if needed:

router.post('/changeProfileData', function (req, res, next){
var id = req.user._id;
console.log(req.body);
var nickname = req.body.nickname;
var name = req.body.name;
var surname = req.body.surname;
var age = req.body.age;
var city = req.body.city;
var country = req.body.country;
var phoneNumber = req.body.phoneNumber;

User.findByIdAndUpdate(id, { $set: { nickname: nickname, name: name, surname: surname, age: age, city: city, country: country, phoneNumber: phoneNumber }}, function (err, user) {
    if (err) return handleError(err);
    console.log("ADDED!!!!!!!!!!!!!");
});

}); Everything ok here with route. My form is sent and the data is stored in the database, but the page on which I submit the form tries to reboot for a long time and eventually goes by the link that is indicated in the form. Help me please, I'm going crazy...

via Bim Bam