We Keep Coding

Scroll to end of page after load ajax

function chat (){
$.ajax({
url: "chat_motor.php",cache: false,success: function(html){
$("#chat").html(html);
},
});
}
setInterval (chat, 1000);
I want scroll to end of page after load chat_motor.php
how can i scroll to down after run this code?

You could do this:
window.scrollTo(0,document.body.scrollHeight);

AJAX page load returns [object object]

I'm currently trying to do a simple AJAX page transition in my local host.
Here is the tag on my home.html
go to blank
Should take me to the blank.html page.
Here is my AJAX:
$(function(){
jQuery(function ($) {
$(document).on('click', "a", function (event) {
event.preventDefault();
$.when($("body").fadeOut(1000).promise(), $.ajax({
url: this.href,
type: 'get',
dataType: 'html'
})).done(function (html) {
var newDoc = document.open("text/html", "replace");
newDoc.write(html);
newDoc.close();
$("body").fadeIn(1000);
});
});
});
});
Without the javascript my redirect works fine, but with the javascript, after the fadeOut it returns [object Object] on the page (and does not redirect)
I have looked around for a solution but cannot seem to find one.
Any help or advice is appreciated, thank you in advance!
EDIT:
console.log(html); returns:

Try this:
$(function(){
jQuery(function ($) {
$(document).on('click', "a", function (event) {
event.preventDefault();
$("body").fadeOut(1000);
$.ajax({
url: this.href,
type: 'get',
dataType: 'html',
success: function(html){
var newDoc = document.open("text/html", "replace");
newDoc.write(html);
newDoc.close();
$("body").fadeIn(1000);
}
})
});
});
});

mCustomScrollbar won't scroll to the very bottom

I'm using this jQuery plugin called mCustomScrollbar and it works fine but I can't make it scroll to the page bottom completely. Here's my code, hope you can help me. Thanks.
$(document).on('click','#comentar',function(e){
e.stopPropagation();
e.preventDefault();
$('.comentario').css({'background-image':'url(image/loading.gif)'});
var comentario = $('.comentario').val();
var foto = $('.comentario').attr('id');
var datosComentario='foto='+foto+'&comentario='+comentario;
$.ajax({
type: "POST",
url: "/includes/comentar.php",
data: datosComentario,
cache: false,
beforeSend: function(){
},
success: function(response){
$('#comentarios_cont p').append(response);
$('.comentario').val('').focus();
$("#comentarios_cont").mCustomScrollbar("update");
$("#comentarios_cont").mCustomScrollbar("scrollTo", "bottom");
$('.comentario').css({'background-image':'none'}).val('');
}
});
});
It scrolls but not to the very bottom.

I had this problem a few minutes ago.
My problem was that a div inside mCSB_container had top and bottom margin. I removed them and now is okay, so check for this.
Hope this helps!

live() alternative on() not working jQuery 1.9

I have code do ajax method for loading new content
But I have problem with the new content, the links not applying the action i did like
preventDefault and the ajax method, just after loading the new content
clicking on links make the page reload like there was no ajax code at all
In JQ 1.8 working grate with live() method, but after updating jQuery, not working as it should with on() method
The old code working right and have no problem with it
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script>
function loadContent(url){
$.ajax({
url: url,
dataType: 'html',
cache: false
}).done(function(html){
var $html = $(html);
$('title').html($html.filter('title').text());
$('#main').replaceWith($html.find('#main'));
$('.nav-menu').replaceWith($html.find('.nav-menu'));
$('.nav-below').replaceWith($html.find('.nav-below'));
});
}
$(function(){
// Get The Content Action
$('.nav-menu li a,#nav-below a,#main a').live('click',function(e) {
href = $(this).attr("href");
loadContent(href);
history.pushState('', 'New URL: '+href, href);
e.preventDefault();
// go top after showing the content
$('html, body').animate({scrollTop:0}, 'slow');
});
// THIS EVENT MAKES SURE THAT THE BACK/FORWARD BUTTONS WORK AS WELL
window.onpopstate = function(event){
loadContent(location.pathname);
$('html, body').animate({scrollTop:0}, 'slow');
};
});
</script>
The new updated code
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
function loadContent(url){
$.ajax({
url: url,
dataType: 'html',
cache: false
}).done(function(html){
var $html = $(html);
$('title').html($html.filter('title').text());
$('#main').replaceWith($html.find('#main'));
$('.nav-menu').replaceWith($html.find('.nav-menu'));
$('.nav-below').replaceWith($html.find('.nav-below'));
});
}
$(function(){
// Get The Content Action, ‡‡=‡=‡=‡=L0000K HERE=‡=‡=‡=‡‡ Not workin JQ 1.9
$('.nav-menu li a,#nav-below a,#main a').on('click',function(e) {
href = $(this).attr("href");
loadContent(href);
history.pushState('', 'New URL: '+href, href);
e.preventDefault();
// go top after showing the content
$('html, body').animate({scrollTop:0}, 'slow');
});
// THIS EVENT MAKES SURE THAT THE BACK/FORWARD BUTTONS WORK AS WELL
window.onpopstate = function(event){
loadContent(location.pathname);
$('html, body').animate({scrollTop:0}, 'slow');
};
});
</script>
The problem right here
$('.nav-menu li a,#nav-below a,#main a').on('click',function(e) {
Thank you :)

You don't simply s/live/on, you need to read the documentation of on() to see the changes required to update your code (on is similar to the old delegate()).
If you want to make it work exactly like live(), try...
$(document).on('click', '.nav-menu li a,#nav-below a,#main a', function(e) { });
However, if you can, you're better off choosing the most common persistent ancestor. This means that the events won't have to go all the way up to document to be handled. For example, body probably covers 99.9% of situations. However, it's probably more like #some-container.

for easy usage you can use something like this:
$.fn.follow = function (event, callback) {
$(document).on(event, $(this).selector, callback);
}
and you can use it like:
$("#myselector").follow("click",function(){
/*some callback code*/
});
you can still use event data in your plugin
$("#expform").follow("submit",function(e){
e.preventDefault();
});

Apply animate to new elements that have been added dynamically

The code i current have is this.
function update (){
latest_id = $('#image:first').data('position'); /* == 12 */
$.ajax({
type: "POST",
url: "../web/update/" + latest_id + "",
success: function(data) {
$('#my_like').after(data);
$('.newly-added').animate({"margin-left": "+=66px"}, "fast");
},
error: function(response) {
alert("failed");
},
});
}
setInterval(function() {
update();
}, 4000);
But because the element has been newly added it doesn't receive the new animate part. I done some research and found .live but that needs something to start it, e.g a click.

Fixed, there was a issue with jquery I was including.