I am trying to add a small delay (2 sec) between the loader icon and the success with the data as html.
What I have tried to use is the setTimeout and put in a delay number. This is not working, so I was hoping you could show me what the correct way is.
My ajax code:
<script type="text/javascript">
$(function () {
var delay = 2000;
var res = {
loader: $("<div />", { class: "loader" })
};
$('#search').on('click', function () {
$.ajax({
type: 'GET',
url: "@Url.Action("Find", "Hotel")",
datatype: "html",
beforeSend: function () {
$("#group-panel-ajax").append(res.loader);
setTimeout(delay);
},
success: function (data) {
$("#group-panel-ajax").find(res.loader).remove();
$('#group-panel-ajax').html($(data).find("#group-panel-ajax"));
}
});
return false;
});
});
</script>
Right now it runs really fast. Hope someone can help.